css四列左浮动布局,左右边距相等

时间:2012-07-02 16:42:29

标签: css-float margins multiple-columns

我有一个四列左浮动布局。我希望左右边距的边距相等。我已将四列向左浮动并在每个浮点上分配一个20px的右边距。全宽列div看起来正确,但边距和列在宽度不同的列上无法正确显示。我已经数学了好几次,我的眼睛正在燃烧,试图找出我做错了什么。

有关最佳方法或如何执行此操作的建议吗?我可以创建一个20px宽度的第一列,总共五列,或使用表格。但我一直在寻找一种更优雅的方式,但也许这是不可能的。我还必须支持IE7。感谢。

Code here - 4 column margins not correct

1 个答案:

答案 0 :(得分:0)

我猜你的CSS问题是你没有考虑填充。

为了使这个更优雅,你应该用等于边距的所有块居中。

我已经检查过您的代码并对其进行了一些修改:)

http://jsfiddle.net/w3YRF/5/

无论如何,我建议你使用网格系统,如Grid960(http://960.gs/),你可以在路上给你一个很好的帮助!

干杯!