jquery的頂部和底部分割屏幕，限制頁面的下半部分

Question

我有一個頂部和底部之間有一條線來調整大小（提供更多的房地產頂部或底部）。

基本上是一個分屏佈局。但是我有一個問題讓底部正確，無論我做什麼，總是延伸到頁面之外，我希望底部的框完全像它在頁面的頂部一樣執行。

下面的演示將基本告訴你我在做什麼，以及我的問題：

http://jsfiddle.net/mstefanko/e38bE/67/

我沒有任何硬編碼的高度（一切目前被設定％ ），但我把它們添加到小提琴演示我的問題。

現在調整頂部和底部的分隔線正在調整頂部的大小，並且我有一些來自jQuery UI Resizable alsoResize reverse的代碼來反向調整底部的大小。我不確定我甚至需要額外的代碼，但是當我無法解決這個問題時，我認爲這值得一試。

另外，爲了讓jquery UI處理正確，頂端有一個大的底部邊緣，這可能會導致我的問題，但玩它似乎並沒有擺脫這個問題。

任何幫助表示讚賞，謝謝！

Answer 1

你的問題是，你試圖將一個固定大小的幾個div分成一個更大的固定大小div，但其他div不適合。你不能指望文本調整大小，當你調整大小手柄，使其適合，divs必須去的地方，所以他們overflow。這裏有幾個建議：

• 給容器auto（所以當你調整它，它太大，不適合，它會自動給你一個滾動條）的CSS overflow值
• 設置溢出值，擺脫縮放器的完全
• 給容器auto或scroll一個css height值（如果大小不是問題）