在我問，我告訴你，我真的是一個新手在CSS。我一直在想，CSS和我不會很好地相處（只是在開玩笑！）無論如何，我認爲我的問題非常簡單，但我無法真正找到讓我的樣式按照它的方式行事的方式。如何讓div繼承瀏覽器窗口的寬度和高度

我想要有一個雙列布局。左欄固定在尺寸上，另一欄是流體。我只想讓它在高度和寬度方面繼承瀏覽器窗口的視口。我嘗試在我的幾乎所有div上添加height:100%;，但我無法使其工作。的確，總共有一個新手。

我已經設置了一個小提示讓你看看我的總新手場景。

fiddle

你快到了！您忘記在身體和的HTML標籤上聲明height: 100%;。

由於您只聲明它在body標籤上，因此它不知道什麼是100％高度，因爲它的父級html沒有設置高度。

這是我改變了CSS：

body, html { 
    margin:0; 
    padding:0; 
    line-height: 1.5em; 
    height: 100%; 
    width: 100%; 
} 

#maincontainer { 
    height: 100%; 
}

最後，小提琴：Demo

我也建議提高你的HTML的結構。

這裏是一個小提琴展示如何清理你的結構，Demo。

2014-02-22 02:04:58

哇！我當然錯過了那個！（或者我想過嗎？）謝謝喬希！ – jellyfication

哈哈在你的設計中沒有問題，祝你好運！請記住，該元素的每個父元素都必須具有100％的高度才能使其基於高度。 –

我真的在做這個造型的東西了。大聲笑。也感謝您清理我的html。 @Josh Powell – jellyfication

要使div的高度達到窗口高度的100％，應該將body和html height設置爲100％。然後設置他們的孩子100％，使他們採取整個窗口的高度..

body, html { 
    margin:0; 
    padding:0; 
    line-height: 1.5em; 
    height: 100%; 
    width: 100%; 
}

2014-02-22 02:07:11 doniyor

如何讓div繼承瀏覽器窗口的寬度和高度