ダイナミックDIVの高さ

Question

私は

<style type="text/css"> 
    html { 
     overflow: hidden 
    } 
    html, body, #centralDIvision { 
     margin-left: auto; 
     margin-right: auto; 
     width: 1100px; 
     height: 400px; 
    } 
    #centralDivision { 
     float: left; 
    } 
    #outer { 
     display: table; 
     position: absolute; 
     height: 100%; 
     width: 100% 
    } 
</style> 

を持っていますが、代わりに400ピクセルに等しいcentralDivision div要素の高さを有するので、私はそれがブラウザの現在の画面サイズの75％になりたいです。私にこれをする方法はありますか？

Answer 1

は、あなたがこれでこの

height: 400px; 

を交換しようとしたことがありますか？

height: 75%; 

Answer 2

#centralDIvision { height: 75%; } #centralDIvision要素は体の直接の子孫であるならば、あなたは非常に近いでしょう。 （高さを％で指定された場合、それは親の高さに基づいています。）

Answer 3

だけ絶対位置を使用して多様性、別のアプローチについて：

#parent { 
    position: relative; 
    height: 400px; 
} 
#child { 
    position: absolute; 
    top: 12.5%; 
    bottom: 12.5%; 
    left: 0; 
    right: 0; 
}​ 

もちろんworking example on jsFiddle、。