水平划分,其中一个空间剩余 [英] Horizontal Divs with One of Them Taking Remainder of Space
本文介绍了水平划分,其中一个空间剩余的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
经典问题是在父div中水平布局2 div,并稍微扭曲 - 其中一个div如何具有固定宽度(例如100px),另一个占据剩余空间(例如100%)在同一行上?
Classic question on laying out 2 divs horizontally within a parent div with a slight twist - How can one of the divs have a fixed width (e.g. 100px) and the other taking up the remaining space (e.g. 100%) on the same line?
<div>
<div id="div1" style="float: left; width: 100px; background-color: #ff0000;">
</div>
<div id="div2" style="float: left; width: 100%; background-color: #00ff00;">
</div>
</div>
小提示: http://jsfiddle.net/mKH46/2/
推荐答案
请检查这 FIDDLE
有轻微的变化您的代码
<div>
<div id="div1" style="float: left; width: 100px; background-color: #ff0000;">
</div>
<div id="div2" style="width: 100%; background-color: #00ff00;">
</div>
</div>
这篇关于水平划分,其中一个空间剩余的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文