三柱可變側網頁設計

Question

我一直在想出一種創建3列網頁設計的方式，其中中心列的寬度恆定並始終居中。左側和右側的列是可變的。這在表格中是微不足道的，但在語義上不正確。在當前所有瀏覽器中，我都無法正常工作。有關於此的任何提示？

Answer 1

使用this technique，並簡單地爲中心列指定固定寬度。

Answer 2

我認爲你需要以邊欄的初始（固定）寬度開始，然後當頁面加載時，使用javascript獲取窗口寬度並計算側邊欄的新寬度。

側邊欄寬度=（窗口寬度 - 中心列的寬度）/ 2

你可以然後重新應用的JavaScript如果窗口大小。

Answer 3

檢查了這一點：http://www.glish.com/css/2.asp

而替換的寬度：通過一個固定的數值xx％爲#maincenter。似乎工作，當我用Firebug改變它，值得一試？

#maincenter { 
    width: 200px; 
    float:left; 
    background:#fff; 
    padding-bottom:10px; 
    } 

Answer 4

This article at A List Apart具有導致3列布局，將溶液：

• 具有固定寬度的側邊欄的流體中心，

• 允許中心柱首先出現在源，

• 允許任何列成爲最高，

• 只需要一個額外的標記div，並且

• 需要非常簡單的CSS，只有很少的補丁。