重新設計我的網站,在我的CSS我有一個高度的div:200px;然後下一個圖像高度:532px;然後最後一個高度的div:100%;.填充剩餘的垂直空間
最後一個div沒有填充頁面的其餘部分,有什麼我做錯了嗎?
P.S. - 所有的div都在一個容器中。所有包含div的高度爲:100%;
我已經改變了它,所以我不再需要這個。
重新設計我的網站,在我的CSS我有一個高度的div:200px;然後下一個圖像高度:532px;然後最後一個高度的div:100%;.填充剩餘的垂直空間
最後一個div沒有填充頁面的其餘部分,有什麼我做錯了嗎?
P.S. - 所有的div都在一個容器中。所有包含div的高度爲:100%;
我已經改變了它,所以我不再需要這個。
你真的需要發佈你的html。
我懷疑你所遇到的問題可以通過設置html和body標籤的高度爲100%來解決。如:
html, body{
height:100%;
}
首先,您需要設置html和body的高度爲100%。 然後,如果你想覆蓋頁面的其餘部分與該分區,你應該這樣做:
div{
height: -moz-calc(100% - 732px); //732 = 200 + 532
height: -webkit-calc(100% - 732px);
height: calc(100% - 732px);
}
希望這將有助於....
如果股利確實服從高度:100 %,它將具有與容器相同的高度,與上面的元素衝突。
如果不使用Javascript計算高度,或者注意廣泛支持的現代CSS擴展,則必須回退到絕對位置。唯一的缺點是你必須手動輸入它的頂部。
<div class="container">
<div class="child1"></div>
<div class="child2"></div>
</div>
。
.container { height: 500px; background-color: Yellow; }
.child1 { height: 200px; background-color: Green; }
.child2 { background-color: Red; }
.container { position: relative; }
.child2 { position: absolute; bottom: 0; left: 0; top: 200px; right: 0px; }
這就是我問過:http://stackoverflow.com/questions/15376558/how-to-fill-100-of-remaining-height – 2013-03-23 01:09:53