用3个div填充屏幕

Question

我有以下情况:

<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应该占用它们之间的剩余空间.我似乎无法让它工作.

有帮助吗？

Answer 1

像这样写:

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>

检查这个http://jsfiddle.net/D8836/

更新

如果你想要相同的高度,那么你可以使用display:table属性.检查一下

http://jsfiddle.net/D8836/11/