CSS最大高さの作業が、同じdivのための高さは、私の外部CSSファイルで

Question

、

#slider { 
    width:1200px; 
    height:800px; 
    margin:0 auto; 
} 

作品を働いているが、

#slider { 
    max-width:1200px; 
    max-height:800px; 
    margin:0 auto; 
} 

がないではありません。
高さが0になります。
最新のクロムブラウザです。 私は何が間違っていますか？
-webkit-calc(100% - 100px)またはcalc(100% - 100px)も機能しません。 私は、css2/css3プロパティのどれも動作していないと推測しています。
私が使用しているこのhtmlファイルは、多くのCSSとjavascriptに含まれている複雑なhtmlの一部です。 css2はブロックされていますか、他のファイルにありますか？

更新日： min-heightを指定し、divの高さを値に設定します。

Answer 1

max-heightに加えてheight: 100%;を適用する必要があります。これにより、親の100％がそれ自身のmax-heightになります。さらに、親のスペースを占有することができます。 （例えば小さい幅/高さ）

html, 
body { 
    height: 100%; 
    width: 100%; 
} 

#slider { 
    height: 100%; 
    max-width: 1200px; 
    max-height: 800px; 
    margin: 0 auto; 
} 

そしてcalc()を使用するためには、それは同じように動作します

JS Fiddle：だから、bodyタグにその場合は最初の子、あなたのような何かをするだろう。親の高さ/幅に関連しています。

JS Fiddle

html, 
body { 
    height: 100%; 
    width: 100%; 
} 

#slider { 
    max-width: 500px; 
    max-height: 500px; 
    margin: 0 auto; 
    height: calc(100% - 100px); 
    width: calc(100% - 100px); 
} 

Answer 2

それはあなたがやろうとしているかによって異なります。だからあなたのような何かを行うことができます。しかし、現時点ではがありません。その要素の内容はです。heightが定義されていない場合、その高さは内容によって異なります。ますます多くのコンテンツ/テキスト/画像を入れてみてください。最大高さの値まで成長し、その後スクロールバーが表示されます。