CSS相对大小列不等宽问题
我正在尝试基于 oocss 框架实现相对宽度列。为了在列之间添加装订线,我在列及其内容之间添加了一个内部 div。
问题是我最终得到宽度不等的列...
我可以通过对第一列和最后一列使用相同的填充来避免这种情况,但由于我想嵌套列,它会在右侧和左侧产生移位。这
是一个小提琴:
欢迎任何想法!
谢谢
I'm trying to implement relative width columns based on the oocss framework. In order to add a gutter in between the columns I added an inner div in between the columns and their content.
The problem is that I end up with columns of unequal width...
I could avoid this by having the same padding for the first and last columns but since I want to nest columns it would create a shift on the right and the left...
Here is a fiddle:
Any idea welcomed!
Thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
问题
出在你的内部 .content div 上。中间列的两侧都应用了填充,而左列仅在右侧具有填充,而右列仅在左侧具有填充。
外部单元 div 的大小均相同。如果您需要视觉效果,使用 firebug 检查元素可以很好地突出显示填充。
}
The problem is with your inner .content divs. The middle column has padding being applied on both sides where as the left column only has padding on the right and the right column has only padding on the left.
The outer unit divs are all the same size. Using firebug to inspect the elements highlights the padding very well if you need a visual.