我正在尝试做3列响应式布局。它也适用于IE8
。所以我使用float: left
作为行中的元素,但我遇到了一些麻烦:
.news_preview { width: 100%; }
,但我不明白如何解决它。.news__item
元素应具有相同的height = 100%
。我知道如何使用JavaScript修复它,但是可以使用css修复它仅适用于.news__item
的{{1}}元素吗?答案 0 :(得分:1)
嗯,你应该注意的几点。我已从.main中删除了height:100%
,并在div之后使用了clear:both
。
关于使用clear:both,在浮动元素之后使用它们,这样就没有额外的高度或空间问题了。
关于第二个问题,我已将display:table
用于主要元素,将display:table-cell
用于子级,并移除float:left
以获得所需的输出。我们还替换了底边以获得结果。有关详细信息,请查看小提琴..
检查here