读书人

webkit下multicolumn的bug和解决技巧一

发布时间: 2012-11-09 10:18:47 作者: rapoo

webkit上multicolumn的bug和解决技巧一则
webkit开始支持多栏属性。

如:

section {display: block;height: 300px;-webkit-column-width: 200px;-webkit-column-gap: 50px;width: 450px;margin-left: -250px;}section::before {content: '';display: block;width: 200px;height: 300px;}


这里的要点是,原先问题是,对于一个只需一栏即可容纳的元素,设定2栏宽度实际造成了多了一个空白栏。要消除这个空白栏,此路不通。那么我们就反其道行之。我们不是消除空白栏,而是通过generated content来填充这个空白栏。这样原本只有一栏的内容都至少会占两栏。对于像计算栏数这样的需求,我们就可以按常规方法计算,把结果减去1,就是真正的结果了。




1 楼 ad4621 2011-08-18 现在多栏布局遇到问题 在多栏布局下 标签怎样定位呢??

读书人网 >Web前端

热点推荐