nasıl yapılır sabit ve yüzde mix yükseklikleri Böyle bir düzen ulaşmak istiyoruz javascript

Question

olmadan css kullanarak/genişlik:

----------------------------------------------------------- 
|               | 
| fixed height           | 
|               | 
|----------------------------------------------------------| 
|              | s | 
| takes all the rest available screen height   | c | 
| fluid height, not fixed,        | r | 
| dependent on the screen height      | o | 
|              | l | 
|              | l | 
|              | b | 
|              | a | 
|              | r | 
------------------------------------------------------------ 

css ve html kullanarak javascript olmadan, bu mümkün mü? Kaydırma çubuğu yukarıdan aşağıya doğru tamamen görülebilir olmalıdır.

Answer 1

Bkz:http://jsfiddle.net/s7FH6/show/ (edit)

HTML:

<div id="header"></div> 
<div id="content"></div> 

CSS:

html, body { 
    margin: 0; 
    padding: 0; 
    overflow: hidden 
} 
#header { 
    background: #ccc; 
    position: absolute; 
    left: 0; 
    top: 0; 
    width: 100%; 
    height: 150px 
} 
#content { 
    background: #eee; 
    position: absolute; 
    left: 0; 
    top: 150px; 
    bottom: 0; 
    width: 100%; 
    overflow-y: scroll 
} 

Answer 2

sadece heres div ve bazı css hakkında örnek okuyabilirsiniz dürüst olmak gerekirse çok basit gibi düzeni elde edebilirsiniz: 604px sadece 100 olarak ayarlayın sadece örnek içindir:

<div style="width: 604px; height: 405px; border: solid 1px black;"> 
<div style="width: 100%; height: 100px; border: solid 1px green;"></div> 
<div style="width: 100%; height: 74%; border: solid 1px blue;"></div> 
</div> 

genişlik olduğunu unutma Tüm ekran boyutunu kullanmak için% aynı yükseklik için gider.

İyi şanslar.

örnek: http://jsfiddle.net/DCbur/2/

Eğer cevap gibi durumlarda oy dont unutmak