垂直部分间距

如何以最少量的代码水平分配3个div？垂直部分间距

我有3个div具有相同的类，我需要水平分配它们，每个div之间有19个像素的空间。

我现在的解决方案是给第一个2个div的右边界19个像素，并为第三个div分配一个单独的类，给它一个19像素的左边界。

这可以完成工作，但我觉得可能有更好的方法。理想情况下，所有3个div仍然会有相同的类别。

2011-08-16 sheepgobeep

参见：http://jsfiddle.net/thirtydot/q6Hj8/

.yourDivClass + .yourDivClass { 
    margin-left: 19px 
}

使用该adjacent sibling combinator申请margin-left每.yourDivClass它由.yourDivClass之前 - 换句话说，所有除第一。

来源

2011-08-16 14:41:22 thirtydot

谢谢！这很好。这是我第一次碰到css选择器。跨浏览器的任何兼容性/支持问题？ – sheepgobeep

不客气。 “+”在任何地方都可以使用，*除了古代的IE6（你不应该再关心）。 – thirtydot

您只需要两列右边距;第三栏不需要额外的保证金。添加了边框，以便您可以在小提琴中看到它。

div.hasMargin 
{ 
    margin-right: 19px; 
} 

div.column 
{ 
    border-color: black; 
    border-style: solid; 
    border-width: 1px; 
    float: left; 
}

这里是一个fiddle

来源

2011-08-16 14:49:59 DwB

我觉得@thirtydot简单明了。 – Sparky

如果你想使用这个（唯一的原因是IE6的支持），你最好添加反转它，并添加一个'noMargin'类而不是多个'hasMargin'类：http://jsfiddle.net/ jkLAK/1 / – thirtydot

垂直部分间距

回答

相关问题