憂藍夢境‧部落格

[CSS] 使多欄式版面高度等高

五月 7th, 2007

5,518 views Goto comments Leave a comment

解決了上一篇的高度不能自動延伸的問題之後，馬上會遇到另一個問題。#container 和 #content 延伸了，旁邊兩個區塊卻仍然維持原本的高度，如果要指定背景就很麻煩了。

解決方法：
加入以下 CSS：


#container {
	overflow: hidden;
}
#left, #right {
	padding-bottom: 1000px;
	margin-bottom: -1000px;
}

利用 padding-bottom 設一個足夠容納所有內容的值
再用 margin-bottom 設相同的負值，將版面拉回來
這樣超過的版面就會被 overflow: hidden 隱藏，達到我們想要的效果。