APICloud学习笔记之div填充剩余

效果图

html 代码

 1 <header id="header">
 2         <div class="left" tapmode onclick="fnOpenCitySelectorFrame();">                                   
 3             <div class="city" id="city">市北京市</div>
 4             <div class="arrow" id="arrow"></div>
 5         </div>
 6         <div class="input-continer">
 7             <input class="search" type="text" >
 8         </div>   
 9                         
10     </header>

css 样式

1     header {
2                 /*position: relative;*/
3                  100%;
4                 height:50px;
5                 background-color: #e1017e;    
6                 clear: both;     
7                 display: flex;       
8             }

1  .input-continer{                 
2                 float:right;
3                 text-align:center;
4                 margin-top:10px;
5                 /*100%;*/
6                 background-color:#00897B;    
7                 flex: 1 1 0;            
8             }