13

min-height: 100%親要素に高さの数値がある場合、親要素の高さの最低100%を占めるためにのみ機能することはわかっていますが、ネストされたdivがいくつかあり、それらすべてに最小高さを持たせたい場合はどうなりますか100%の?やってみmin-height:inheritたけどダメだった?ドキュメントの読み込み時にブラウザーの高さの値を確認し、それをネストされた div の min-height プロパティに割り当てるだけで、おそらく JavaScript でこの問題を解決できることはわかっていますが、これを解決できるかどうか知りたいです。 cssだけで?

編集: また、最も外側の div とネストされた div の最小高さをすべて 100% にして、少なくともブラウザーの高さを占めるようにする必要があることにも言及する必要がありますが、必要に応じて拡張します。

4

2 に答える 2

22

min-height: inherit;動作するはずです: http://jsfiddle.net/ugxbs/

編集

パーセンテージ値と予想される動作に関しては、ネストされたmin-height の背後にあるロジックはありません。あなたがすべきことはheight、すべての親にプロパティを使用してから、最も内側に min-height を追加することDIVです。

例:

<html>
    <body>
        <div class="outer">
            <div class="inner"></div>
        </div>
    </body>
</html>

CSS:

html, body, .outer { height: 100% }
.inner { min-height: 100%; }

http://jsfiddle.net/4PsdT/

このようにして、上部 ( ) からすべての外側の要素HTMLを 100% の高さに設定するようにブラウザーに指示します。これにより、これらの要素がブラウザーの高さ全体に引き伸ばされます。min-height次に、コンテンツを含む最も内側の要素にa を追加します。

を設定しheightても、 を追加しない限り、子供向けの過剰なコンテンツが脱落するわけではありませんoverflow:hidden;。</p>

于 2012-08-11T18:29:01.667 に答える
0

プロパティの高さでは機能しますが、最小の高さでは機能しません。

http://jsfiddle.net/zDVqm/

于 2012-08-14T07:36:14.583 に答える