CSS 3列布局，高度靈活的側欄，SEO的代碼順序：CONTENT-LEFT-RIGHT

Question

我想獲得一些關於CSS的建議。 我的目標是：

1. 3列布局-左側欄，主要內容，右側欄
2. 邊欄具有基於內容列高度的靈活高度。
3. 出於SEO的目的，我需要按順序調用包含內容的PHP文件。
   1. 主要內容文件
   2. 左側邊欄文件
   3. 右側工具欄文件

因此，div必須按以下方式進行排序：

<div id="columns-container">
        <div id="content-bar">              
             <!-- PHP include of the content (middle bar) -->                                       
        </div>
        <div id="left-sidebar">             
            <!-- PHP include of the leftbar navigation -->                                          
        </div> 
        <div id="right-sidebar">            
            <!-- PHP include of the rightbar with ads and stuff -->                                     
        </div>          
</div>

如果我按“左欄-內容-右欄”的順序調用文件，那對我來說也很容易。 但這對我來說是一個很高的要求。

到目前為止，我已經能夠創建最小高度的側邊欄，但是我不知道如何擴展它們。

我迷失了CSS，我認為我的解決方案是錯誤的，因此，如果有人幫助我從頭開始並更好地構建它，我將不勝感激。

Answer 1

您可以使用一種最流行的“即用型”布局： Holy Grail 。 它具有您所要求的一切。