1

正如我所见，我只能在一个容器中创建多行。当并非所有元素都具有相同的高度时，IE 就会出现问题。以下示例显示了 IE8 中的 3x3 网格。注意第 4 个元素出现在第 5 个之后。

http://tinypic.com/r/f27iur/5

幸运的是，我可以在每行的第一个元素中使用简单的“clear:both”来解决这个问题......

<div class="container">
    <div class="item">one (Lorem ipsum dolor sit amet, consectetur adipisicing elit.)</div>
    <div class="item">two</div>
    <div class="item">three</div>
    <div class="item">four</div>
    <div class="item">five</div>
    <div class="item">six</div>
</div>

…

@include border-box-sizing;

.container {
    background: #f00;
    @include container;
}

.item {
    background:#ccc;
    @include span-columns(1,3);
    &:nth-child(3n) {  @include omega; }
    &:nth-child(3n+4) { clear: both; }
}

这适用于 IE8，但在 IE7 中，第二行的元素显示在顶部对齐，我不知道如何解决这个问题。

http://tinypic.com/r/2mfybmb/5

4

0 回答 0