在网格中间距相同大小的项目?

时间:2013-03-30 02:12:30

标签: html css

我正在寻找与ie8兼容的方法来创建网格:

http://jsbin.com/ihicuz/1/edit

HTML:

  <div class="grid">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
  </div>

CSS:

.grid{
  background:#DDD;
  width:830px;
  height:830px;
}
.grid>div{
  height:200px;
  width:200px;
  box-sizing:border-box;
  border:1px solid #AAA;
  float:left;
  margin:0 10px 10px 0;
  background:#EEE;
}
.grid>div:nth-child(4n){
  margin-right:0;
}

nth-child工作(好吧,忽略了保证金底部的溢出)但是对ie8不起作用。

是否有一个干净的解决方案来在不更改html标记的情况下在这些网格项之间获得相等的间距?

1 个答案:

答案 0 :(得分:0)

Selectivizr负责处理CSS3选择器的许多IE兼容性问题。

http://selectivizr.com/