我該如何設置一個全高邊欄,使用響應式網格系統,與自舉類似?100%高度響應邊欄
我運行它的問題是.main
包裝div摺疊到.primarycol
div的高度。
我使用拉和推類來調整視覺佈局,因此.secondarycol
div看起來像它的左邊,儘管它在代碼中的.primarycol
div之後。
<div id="main" class="main content">
<div class="row">
<div id="primarycolumn" class="primarycol col12 col9-768 col3-768-push" role="main"></div>
<div id="secondary" class="secondarycol col12 col3-768 col9-768-pull col7-1024-pull" role="complementary"></div>
</div>
</div>
通常情況下,沒有.secondarycol`類,股利會和這個樣子。
我曾嘗試加入min-height:100%
到.main
股利和height:100%
到body
標籤,但使main
DIV高度永遠只能是瀏覽器窗口的高度,而不是內容。
任何有關如何補救此問題的建議都會非常受歡迎。
這是我的基礎結構的codepen。 http://codepen.io/onebitrocket/pen/ZYQLMm/
我已經在第三列中添加以及一些頁面需要一個。
該列系統基於bootstraps,但我認爲它是一個改進版本: 列類聲明從最小尺寸到最大尺寸。 我也改變了類名來指示斷點大小而不是XS,SM,MD,LR等。
感謝
你可以請把代碼放在jsfiddle或codepin中。如果你這樣做,你很可能會很快得到答案。 – bryjohns 2014-12-05 23:49:47
顯示.secondarycol的CSS代碼。 – xio4 2014-12-05 23:52:21
如果我不得不猜測推拉正在用浮筒做什麼。您可能需要在.secondarycol – bryjohns 2014-12-05 23:53:16