CSS div 使用两个元素之间的所有空间

Question

我的问题是我想在其他两个元素之间放置一个 div。

这是我的 fiddle 代码:

http://jsfiddle.net/NHBVa/1053/

div content

Answer 1

您可以使用以下样式实现您想要的效果:

.container {
    padding-left:30px; /* width of left container */
    padding-right:30px; /* width of left container */
}
.container > div {float:left;}

.left {
    margin-left:-30px;
    width:30px;
    height:30px;
    background-color:yellow;
}
.right {
    margin-right:-30px;
    width:30px;
    height:30px;
    background-color:yellow;
}
.content {
    width:100%;
    background-color:red;
}

http://jsfiddle.net/NHBVa/1054/