我有以下情况:
<div id="container">
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
</div>
div1
和div3
的固定宽度为100px
,高度为100%
,div3
的高度为100%
。
我想要的是让div1
向左浮动,div3
向右浮动,div2
应该占用它们之间的剩余空间。我似乎无法让它发挥作用。
任何帮助?
答案 0 :(得分:7)
像这样写:
<强> CSS:强>
#div1{
float:left;
background:red;
width:100px;
}
#div3{
float:right;
background:green;
width:100px;
}
#div2{
overflow:hidden;
background:blue;
}
<强> HTML 强>
<div id="div1">1</div>
<div id="div3">3</div>
<div id="div2">2</div>
<强>已更新强>
如果你想要相同的高度,那么你可以使用display:table
属性。检查一下
答案 1 :(得分:2)
这个不需要你改变你的div的顺序,但确实需要CSS3(弹性框)。 http://jsfiddle.net/pPEmZ/