CSS相对大小列不等宽度问题

Question

我正在尝试基于oocss框架实现相对宽度列。为了在列之间添加装订线，我在列和它们的内容之间添加了一个内部div。

问题是我最终得到了宽度不等的列......

我可以通过对第一列和最后一列使用相同的填充来避免这种情况，但由于我想嵌套列，因此会在右侧和左侧创建一个移位...

这是一个小提琴：

http://jsfiddle.net/WxPSm/2/

欢迎任何想法！

由于

Answer 1

.unit > .content:first-child {
padding: 0 2em;

}

问题在于你的内部.content div。中间列在两侧都应用了填充，因为左侧列仅在右侧有填充，而右侧列仅在左侧有填充。

外部单位div的大小都相同。如果需要视觉效果，使用firebug检查元素会很好地突出显示填充。