CSS 均匀分布图像行，这将在 IE8 中工作

Question

不知道有没有大佬解决这个问题。我想要一个 6 列乘两行的图像网格。目前它工作正常:http://oaeyewear.4pixels.co.uk/brands.html 我正在使用:

.gallery {
   list-style-type: none;
}
.gallery li {
    float: left;
    height: 130px;
    width: 130px;
    margin-bottom: 26px;
    margin-right: 26px;
}
.gallery li:nth-of-type(6n+0) {
    margin-right: 0px;
}

但我知道 IE8 无法识别 nth-of-type 选择器。有什么办法吗

1. 让 IE8 一起玩。 Selectivizr 不会用 jQuery 和 我不想介绍另一个库
2. 为 IE8 使用其他一些条件 CSS
3. javascript?

理想情况下，解决方案需要响应式工作，因为网站是基于 Foundation Framework 的。目前它工作得很好，因为它缩小到两列，我可以改变 <li>使用媒体查询在 300 像素范围内工作。

Answer 1

在这种情况下，我会使用负边距方法。

    .gallery {
       list-style-type: none;
       margin-left: -26px;
    }
    .gallery li {
        float: left;
        height: 130px;
        width: 130px;
        margin-bottom: 26px;
        margin-left: 26px;
    }