實踐了一下；
css:
body
#container
#container .column
#center
#left
#right
#footer
/*** ie6 fix***/
* html #left
/*** ie7 fix***/
*:first-child+html #left
這樣能實現最簡單的三欄布局，並且三欄的高度自適應，根據裡面的內容來定。最後是對ie6和ie7的修復.
如果想實現三欄一樣高，並且加上padding,使得頁面更加美觀，那麼需要這樣寫css。
ie6,ie7下總是有很多問題需要單獨解決。。
這也只是實踐 ，還有很多問題沒搞明白，最後ie7的修復是自己實踐的結果。
聖杯布局的原理
in search of the holy grail 兩邊定寬，中間自適應的三欄布局，中間欄要放在文件流前面以優先渲染。html class content class center col div class left col div class right col div div css 第一...
聖杯布局的實現
經典三列布局，也叫聖杯布局 holy grail of layouts 在國內也叫雙飛翼布局。它的布局有幾點要求 1 三列布局，兩邊寬度固定，中間寬度自適應 2 中間欄要在瀏覽器中優先展示渲染 3 允許任意列的高度最高 4 要求只用乙個額外的div標籤 5 要求用最簡單的css 最少的hack語句。...
聖杯布局詳解
樣式表很簡單，就是說你有乙個左邊的寬度為200px的列，右邊有乙個寬度為150px的列，中間的列自適應。核心的css 如下 這種方式能夠相容現在的許多主流瀏覽器，例如 safari,opera,firefox,and with the single rule hack at the bottom i...