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

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

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

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