3

私は2つのコンテナ（main-containerとsub-container）を持っています。100%Body、HTML、およびmain-containerには高さのクラスがありますが、でsub-container固定されてい1000pxます。メインコンテナは、小さい場合でも大きい場合100%でも、画面全体の高さに合わせる必要があります。sub-containerここで問題となるのは、メインコンテナがサブコンテナの高さに応じて高さを上げていないことです。私の要件を理解するには、以下の例を確認してください。

http://jsfiddle.net/awaises/dLeHL/

本当にあなたの助けに感謝します。

ありがとう

4

3 に答える 3

8

に変更: http://jsfiddle.net/dLeHL/3/height:100%; _min-height:100%;.main-container

編集：

高さのパーセンテージ ルールについては、こちらで説明しています。

パーセンテージの高さ 要素の高さがパーセンテージに設定されている場合、その親要素の高さが設定されている必要があります。つまり、親要素の高さを auto に設定することはできません。CSS の多くの側面と同様に、これは最初は少し混乱します。

于 2012-05-26T14:41:25.283 に答える
4

これはあなたが達成しようとしていることですか？

.sub-containerのようになる%ように、の幅を変更し.main-containerます。

CSSマークアップ：

html, body { 
    height:100% 
}
.main-container { 
    height:100%; 
    background:red; 
}
.sub-container { 
    height:100%; 
    width:75%; 
    margin:0 auto; 
    background:blue; 
}

それが役に立てば幸い！

于 2012-05-26T14:36:42.160 に答える
2

heightを設定する必要はありません.main-container(既定では、子コンテナーのサイズに拡張されます)。高さを 100% に設定すると、強制的に画面の高さになり、それ以上ではなくなります。したがって、次のように変更してください。

.main-container { background:red; }

min-heightメインコンテナを常に画面の高さ以上にする必要がある場合は、設定を削除しながら を 100%に設定するという @Helstein の提案を使用してheightください。

于 2012-05-26T14:45:38.513 に答える