如何在網頁上垂直安裝流體容器（僅在容器上滾動）？

Question

我有一個網絡應用程序，我正在嘗試使網格中的流體容器（col-md-6）內容流暢，並將其內容水平和垂直地放在頁面上。

的想法是讓它儘量在瀏覽器的頁面不滾動，而是在網格中的內容具有「溢出：汽車;」設置，所以如果需要的話，網格內容可以滾動。在圖片中，表格在屏幕上運行，整個頁面可以滾動，而不僅僅是內容。

所以網格應該是固定的，並且在所有四邊都有一個導航欄，幾乎就像一個框架，中心內容應該被刷新。

我試過將中心面板設置爲position：fixed;但是它會將其從HTML流中取出，因此它不能響應。所以我真的需要將所有內容與頁腳齊平，然後根據屏幕大小進行水平和垂直響應。

任何幫助或代碼都會很棒。

Answer 1

你將不得不寫一些自定義的CSS來完成這項工作。

首先，你需要設置body和html到height: 100%和min-height: 100% - 你還需要與你的fluid-container和你col-md-6做到這一點。這將使他們垂直填充空間。之後，在網格內容上設置您的overflow-y: scroll。

請注意，您將不得不在媒體查詢中編寫額外的CSS來處理佈局響應低於md大小時發生的情況。 Bootstrap文檔可以幫助解決這個問題。

對於任何更詳細的幫助，我真的需要看你的代碼。