幫助CSS - 獲得一個元素來填充剩餘的垂直空間的100％

我認爲自己是一個合理的標準CSS/XHTML小夥子，但我對此很困惑。幫助CSS - 獲得一個元素來填充剩餘的垂直空間的100％

問題在這裏：http://furnace.howcode.com - （請注意，該網站仍在開發中，大多數內容不起作用，並且它可能會很快更新，因爲它經常更新）。

基本上我有一個流體佈局，需要在任何分辨率的相同比例工作。

這裏的設計師如何invisioned它的截圖（我爲我的畫圖工具anotations道歉）： how the designer wants it to look http://files.droplr.com/files/49111734/XVu5m.howcode_working4.png

我想要的標籤和搜索框col2的頂部留下來，而應該有在其下面返回結果的可滾動區域。我不希望垂直視口滾動，只能在100％高度區域內進行滾動。

我的問題是這樣的。如果你看看http://furnace.howcode.com，你會發現我遇到了一些問題。我已經做了一個佔位符黑色背景div，我將很快變成標籤。不過，我希望Col2 div能夠將BENEATH浮動並填充剩餘垂直高度的100％（即，轉到屏幕底部，不管分辨率是什麼），Col3將放在Col2當前放置的位置（它當Col2在正確的地方時，通常會自動出現！）。

我希望這是有道理的。如果你需要我澄清，請問。

乾杯！傑克

來源

2010-05-08 Jack

提出三點高度：100點％的div（COL1，COL2，COL3）從頂部到達到底部，並把標籤等內col2。

來源

2010-05-08 12:24:31 Tgr

謝謝...我似乎記得有一些原因，我爲什麼不能這樣做......但我會試試看怎麼了。 – Jack 2010-05-08 12:27:58

-1

我真的認爲你不能簡單地通過使用HTML和CSS來做到這一點。簡單地說，如果你想擁有一個可滾動的div，你必須給它一個固定的高度，但我非常肯定，如果你給它一個100％的高度，它只會展開以顯示其所有內容。

要解決此問題，您必須使用Javascript來修復可滾動區域的高度。你必須根據頁面加載時窗口的高度來修正div的高度，如果窗口調整大小，還要調整div的大小。

這樣的財產以後可以工作：

$(document).ready(function(){ 
    $("#myScrollableDiv").height($(window).height() - $("#myHeader").height()); 
});

只需更換標識是你的ID在HTML

來源

2010-05-08 12:14:28 StevenGilligan

我很欣賞答案，但我已經有固定的可滾動區域工作：當然，你可以使用overflow-y：scroll？它似乎在我的情況下工作。我只需要知道如何將Col2放在Tab div下面，並將它保留在那裏，無論我們處於什麼樣的分辨率。 – Jack 2010-05-08 12:16:15

除非我誤解了你的答案...... – Jack 2010-05-08 12:16:36

真正的javascript如何？知道如何寫任何？ – sproketboy 2013-02-06 22:17:54

幫助CSS - 獲得一個元素來填充剩餘的垂直空間的100％

回答

相關問題