Flexbox的3列2列（2個側邊欄到一個單一的工具條）

是否有Flexbox的解決方案3列的大屏幕上......Flexbox的3列2列（2個側邊欄到一個單一的工具條）

+-----+ +----------+ +-----+ 
|  | |   | |  | 
| A | | B  | | C | 
|  | |   | |  | 
|  | |   | +-----+ 
+-----+ |   | 
     +----------+

，將改變以...

+-----+ +----------+ 
|  | |   | 
| A | | B  | 
|  | |   | 
|  | |   | 
+-----+ |   | 
+-----+ |   | 
|  | +----------+ 
| C | 
|  | 
+-----+

在較小的屏幕上，其中A，B和C可以具有可變的高度。基本上B是主要內容，A和C是側邊欄。

來源

2016-11-20 honkskillet

你嘗試過什麼？我們幫助您修復代碼，而不是從頭開始爲您編寫代碼。 –

試試這個： -

<body class="HolyGrail"> 
    <header>…</header> 
    <div class="HolyGrail-body"> 
    <main class="HolyGrail-content">…</main> 
    <nav class="HolyGrail-nav">…</nav> 
    <aside class="HolyGrail-ads">…</aside> 
    </div> 
    <footer>…</footer> 
</body>

來源

2016-11-20 03:44:34

Flexbox的3列2列（2個側邊欄到一個單一的工具條）

回答

相關問題