在IE8兼容模式下出现问题的min-width属性

Question

附加 .list 的父DIV 。 Paretnt DIV 由 8个浮点数和位置：相对属性组成。

Parent Div具有 min-width 属性，当我在 IE8兼容模式中打开页面时，将 min-width 属性视为< strong> width 属性并连续显示所有8个DIVS。它应该只显示3个div。

这是HTML代码

<div id="list-container">
<div class='list'>
            <div class='item'><h1>1</h1></div>
            <div class='item'><h1>2</h1></div>
            <div class='item'><h1>3</h1>
            </div>
            <div class="item"><h1>4</h1>
            </div>
            <div class='item'><h1>5</h1>
            </div>
            <div class='item'><h1>6</h1>
            </div>
            <div class='item'><h1>7</h1>
            </div>
            <div class="item"><h1>8</h1>
            </div>

        </div>
</div>

CSS代码

.list{
    background:grey;
    min-width:1400px;
    float:left;
}

.item{
    background:green;
    width:140px;
    height:80px;
    margin:5px;
    float:left;
    position:relative;
}
#list-container {
float: left;
overflow: hidden;
width: 450px;

}

它在Firefox中运行良好。

更新：我在IE7中也看到了相同的问题（使用IE8浏览器并将浏览器模式从开发人员工具切换到IE7）

编辑：为了更多清晰度添加图片

IE7和IE8兼容模式

FF

提前致谢

Answer 1

您不能使用子元素设置宽度较小的父容器。它总会在某些方面表现出古怪。 ie8也不支持最小宽度。尝试删除最小宽度。

如果你向我们展示你真正想做的事情，我们可以提供更多帮助。

Answer 2

对于IE，您应该添加* html .yourclass{height: 1%;}来修复。你试过了吗？

Answer 3

你继承了错误的类，使父母和孩子有所不同，这将有助于确保:) 看看小提琴

   link:  http://jsfiddle.net/MarmeeK/gu3Us/1/

谢谢，