table 布局
假设我们有如下两个元素:
<label>Name</label>
<input class="inputtext" type="text" />
name的width固定,需要input的宽度自实用屏幕大小,使两个元素始终保持在同一行。
可以这样做
<div class="parent">
<label>Name</label>
<input class="inputtext" type="text" />
</div>
.parent {
display: table;
width: 100%;
}
.parent label{
display: table-cell;
width: 11%;
padding-left: .4em;
min-width: .9em;
}
.parent .inputtext {
display: table-cell;
width: 80%;
}