1

このページを例にとると、mydivの高さが500pxを超えるように、mydivに子を挿入することは可能ですか？


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
    <div id="mydiv" style="width:500px;height:500px;border:4px solid red">
        <!-- place content here -->
    </div>
</body>
</html>

私はそうするものを見つけることができません。たとえば、以下のこの状況では、innerDivの高さを100％にするように指示しました。親の高さが500pxであることがわかります。したがって、高さも500pxです。最終的な結果として、コンテンツの高さは800ピクセルになり、コンテンツはmydivを超えて流出しますが、mydivの高さは500ピクセルのままです。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<body>
    <div id="mydiv" style="width:500px;height:500px;border:4px solid red">
        <img src="myimage.jpg" width="400" height="300" />
        <div style="width:100%;height:100%;background:yellow">
            hi
        </div>
    </div>
</body>
</html>

IEをquirksモードで実行すると、mydivが成長して、多くの状況で子を収容できるようになります。標準モードは明示的に成長しないようです。それはいつもそうですか？

私はこれを主にWindowsのIE8とFF3.5でテストしており、IE8はすべての可能なモードで実行されています。

4

1 に答える 1

3

いいえ：標準モードでは、コンテナのデフォルトoverflowプロパティは、visibleオーバーフローしたコンテンツがコンテナのクリッピング領域の外側にレンダリングされることを意味するように設定する必要があります。overflow子に合わせてコンテナのサイズを大きくするようなオプションはありません。ここでオーバーフローの詳細を見ることができます

ただし、子のサイズに合わせてコンテナを成長させる方法があります。標準モードでは、これを行う正しい方法は、プロパティmin-heightの代わりにCSSプロパティを設定することですheight。

高さを強制する動作はIE6では発生しないため、通常、標準に準拠したブラウザーの両方を設定してからmin-height、条件付きコメントheightのみを使用してIEに設定するか、プロパティ名の前にアンダースコアを付けてIE6が他のブラウザーを使用するようにします。それを無視します。_

だからあなたのdivは次のようになります

<div id="mydiv" style="width:500px;min-height:500px;_height:500px;border:4px solid red">

min-height 詳細については、こちらをご覧ください。Google/ Bingですばやく検索するmin-height IE6と、必要なすべての回答が得られます。

于 2009-11-11T00:56:30.347 に答える