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

Question

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

这是我的小提琴代码：

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/

Answer 2

只需float:left;为这三个 div添加

.left,
.right,
.content{
    float: left;
}

http://jsfiddle.net/sweetmaanu/NHBVa/1056/