Question

我希望以下内容（每5个元素与“.span-tag”类）兼容IE 7/8

.taggar .row-fluid .span-tag:nth-child(5n),
    margin-left: 0;
}

我尝试了以下内容，但它不起作用，所以我可能做错了：

.taggar .row-fluid .span-tag:first-child + .span-tag .span-tag .span-tag .span-tag {
    margin-left: 0;
}

HTML：

<div class="action-container container taggar">
    <div class="row-fluid">
        <div class="span3 span-tag">
            <a href="#"><div class="tag label btn-tag tags"><span>foo1</span></div><span class="votes">x 61</span></a>
        </div>
        <div class="span3 span-tag">
            <a href=""><div class="tag label btn-tag tags"><span>foo2</span></div><span class="votes">x 52</span></a>
        </div>
        <div class="span3 span-tag">
            <a href=""><div class="tag label btn-tag tags"><span>foo3</span></div><span class="votes">x 387</span></a>
        </div>
        <div class="span3 span-tag">
            <a href=""><div class="tag label btn-tag tags"><span>foo4</span></div><span class="votes">x 343</span></a>
        </div>
        <div class="span3 span-tag">
            <a href=""><div class="tag label btn-tag tags"><span>foo5</span></div><span class="votes">x 434</span></a>
        </div>
        <div class="span3 span-tag">
            <a href=""><div class="tag label btn-tag tags"><span>foo6</span></div><span class="votes">x 4</span></a>
        </div>
        <div class="span3 span-tag">
            <a href=""><div class="tag label btn-tag tags"><span>foo7</span></div><span class="votes">x 134</span></a>
        </div>
        <div class="span3 span-tag">
            <a href=""><div class="tag label btn-tag tags"><span>foo8</span></div><span class="votes">x 32</span></a>
        </div>      
    </div>
</div>

Answer 1

我不确定您的问题，但您可以使用a link - selectivizr是一个JavaScript实用程序，可在Internet Explorer 6-8中模拟CSS3伪类和属性选择器

Answer 2

在不使用nth-child的情况下执行此操作的唯一方法是非常非常冗长（您必须分别针对每个第5个案例） -

如果你知道span-tag类的数量的上限 - 那么它可能是这样的，否则 - 你运气不好。：

.span-tag:first-child + .span-tag + .span-tag + .span-tag + .span-tag { /* 5 times */
    margin-left: 0;
}

.span-tag:first-child + .span-tag + ... + .span-tag { /* 10 times */
    margin-left: 0;
}

.span-tag:first-child + .span-tag + ... + .span-tag { /* 15 times */
    margin-left: 0;
}

等

nth-child转换为IE支持

2 个答案: