0

有一个附加了类.list的父 DIV 。Paretnt DIV由8个具有position:relative属性的浮动 div 组成。

Parent Div 具有min-width属性，当我在IE8 兼容模式下打开页面时，它会将min-width属性视为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兼容模式

在此处输入图像描述

法郎

在此处输入图像描述

提前致谢

4

3 回答 3

0

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

于 2013-03-22T12:28:27.657 回答
0

您不能为其子元素设置宽度较小的父容器。它总是在某些方面显得古怪。ie8 也不支持最小宽度。尝试删除最小宽度。

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

于 2013-03-22T12:15:50.650 回答
0

您继承了错误的类，使父母和孩子有所不同，这肯定会有所帮助:)看看小提琴

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

谢谢你，

于 2013-03-23T07:39:51.950 回答