0

クラス.listが添付された親DIVを用意します。Paretnt DIVは、position:relativeプロパティを持つ8つのfloatdivで構成されます。

親Divにはmin-widthプロパティがあり、 IE8互換モードでページを開くと、min-widthプロパティがwidthプロパティと見なされ、8つのDIVSすべてが連続して表示されます。その中のどこに3divのみを表示する必要があります。

これが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

ここに画像の説明を入力してください

前もって感謝します

4

3 に答える 3

0

子要素を使用して、幅の狭い親コンテナを設定することはできません。それは常にいくつかの点で風変わりなものを示します。また、ie8はmin-widthをサポートしていません。最小幅を削除してみてください。

あなたが本当にやりたいことを私たちに示してくれれば、私たちはもっと助けになるでしょう。

于 2013-03-22T12:15:50.650 に答える
0

あなたは間違ったクラスを継承しており、親と子を違いにしています。これは確かに役立ちます:)フィドルを見てください

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

ありがとうございました、

于 2013-03-23T07:39:51.950 に答える