Question

是否可以仅在浮动的div 之间创建边距没有边距。

基本上是这样的：

no margin <div> |margin| <div> |margin| <div> |margin| <div> no margin
no margin <div> |margin| <div> |margin| <div> |margin| <div> no margin
no margin <div> |margin| <div> |margin| <div> |margin| <div> no margin
no margin <div> |margin| <div> |margin| <div> |margin| <div> no margin
no margin <div> |margin| <div> |margin| <div> |margin| <div> no margin

像那样。

Answer 1

使用first-child和last-child选择器分别指定左/右边距：

http://jsfiddle.net/ExplosionPIlls/bzSgp/1

如果您在第一个/最后一个div之间有其他元素，则可以使用first-of-type / last-of-type代替。

Answer 2

很抱歉，要把它挖出来，但是在谷歌搜索该主题之后就出现了：

这就是为什么我要指出，当包含元素的宽度已知时，是一个仅使用负边距在包装DIV上的CSS解决方案（我主要使用这里的百分比）

.wrapper { 
    margin: -1em;
    overflow:hidden; /* or other clearfix if you need overflow */
}
.item {
    margin: 1em;
    float:left;
    /* ... */
}

我还快速组合demo pen。

例如，Bootstrap的网格系统以类似的方式工作！

-

这种方法的一大优点是，您不必确切知道连续多少项（如您所知：nth-child（）方法）。因此，针对不同的屏幕尺寸处理起来要容易得多。

仅在浮动div之间的边距

2 个答案: