Question

我试图让两个div并排在一个包装div的中心。我当前的方法是将包装器内容对齐到中心，然后显示为内联块。但是，这在IE7中不起作用，我必须编写代码。我用一个简单的例子添加了一个JS小提琴。有没有办法在IE7中实现这一目标？

HTML

<div id="wrapper">
    <div id="div1">
        div1
    </div>
    <div id="div2">
        div2
    </div>
</div>

CSS

#wrapper{
    height:800px;
    text-align:center;
    background-color:orange
}

#div1{
    background-color:green;
    width:100px;
    display:inline-block;
}

#div2{
    background-color:blue;
    width:100px;
    display:inline-block;
}

Answer 1

有一个IE7 hack可以正确显示元素，就好像它们是内联块元素一样。 hack被添加到css中，如下所示。

#div1{
    width:300px;
    display:inline-block;
    zoom:1;
    *display:inline;
}

*仅允许IE解释display:inline属性。 zoom:1允许内联元素以宽度by triggering hasLayout显示。来源如下：

http://uncorkedstudios.com/blog/how-to-fix-the-ie7-and-inlineblock-css-bug

并排ie7不使用浮动

1 个答案: