身高百分比不工作在CSS

我想使用百分比的高度屬性，但它不工作。我想使用百分比，所以在任何分辨率下看起來都不錯。身高百分比不工作在CSS

<div id="bloque_1" style="height: 80%;background: red"> 
</div>

我該如何讓它工作？

2013-05-20 Flezcano

身高比例是有點草率，但如果你堅持，使用百分比將只考慮容器的高度的百分比。嘗試添加{最小高度：100％; }添加到您的{body}標籤。 –

min-height doest work =（。我用它代替，身高：100％ – Flezcano

現在你會遇到問題，當你的內容高度需要擴大到100％以上 –

當您使用%爲寬度或高度，你應該問的第一個問題是80%是什麼？所以，你還需要辦理高度父元素，所以假設你的這個元素是body標籤裏面，你需要在你的CSS使用此

html, body { 
    height: 100%; 
}

所以，現在你div元素將是100%80%

邊注：此外，當你正在處理absolute定位的元素，你可能會遇到這樣一個場景，你的div將不會超過當前視口的高度，所以在這種情況下，你需要有min-height

2013-05-20 05:02:17

我一直在擺弄一段時間的類似問題，我一直將身體設置爲100％，但不是HTML，謝謝！ –

bloque_1以外的所有東西都需要一個高度，否則您將獲得0的80％。您可能還需要對body應用100％的高度。

這是一個jsfiddle，它顯示了它的行動。

2013-05-20 05:00:16 neokio

你的父元素

HTML代碼 -

<html> 
<body> 
<div id="bloque_1" style="height:80%;background:red;width:100%;"> 
</div> 
</body> 
</html>

CSS本部

html, body { height: 100%; width: 100%; margin: 0;background: #3c3c3c }

工作小提琴上的應用100%高度 - http://jsfiddle.net/SEafD/1/

2013-05-20 05:00:36 swapnesh

html,body{ 
    height:100% 
} 
#bloque_1{ 
    background:red; 
    height:80%; 
}

2013-05-20 05:05:18

回答