7

指定された高さのコンテナー<div>があり、その中に含まれているのはさらに 2 つの DIV で、さまざまな (クライアントによって入力された) 紹介用のコピー用であり、別の DIV はさまざまな機能を一覧表示するためのものです。

機能<div>が親の残りのスペースを自動的に埋めてから、オーバーフローをスクロールアウトするようにします。

それ、どうやったら出来るの？

CSS:

#article {
    width:940px;
    height:500px
}

#article-content {
    margin: 20px 0;
}

#article-features {
    height:100%;
    overflow-x: auto;
}

jsフィドル

4

1 に答える 1

4

計算（parent_height - sibling_height）に基づいて下部のdivの高さを動的に変更するためにJavaScriptに依存する以外に、HTML4でそれを行う方法はありません。

これを見ることができます: CSS HTML - DIV 高さの残りのスペースを埋める

HTML5 では、Flexbox を使用して残りのスペースを使用できます。いくつかの制限がありますが、要件を満たすことができることに注意してください。http://caniuse.com/#feat=flexboxを参照してください。

于 2012-07-31T12:40:01.800 に答える