無法將css div垂直和水平拉伸100％

我想將我的表格設計轉換爲css div設計。無法將css div垂直和水平拉伸100％

什麼不起作用：

1）黑色格將列表中的項目，因此我需要它的時刻顯示滾動條。沒關係。但我不想限制高度爲400px。我以前的設計高度爲100％，因此需要屏幕上的所有垂直空間。

2.）紅色div（rightContent）的寬度固定爲200px;當我設置這個時，我必須設置什麼，左內容需要所有的水平空間。

總之，在舊的表格佈局中，在整個佈局周圍沒有可見的外部垂直滾動條。

我對IE9測試

這

http://jsfiddle.net/pEMwP/4/

來源

2012-06-11 Elisabeth

這可以幫助1）http://stackoverflow.com/questions/4075440/dynamic-height-for-div –

而只是讓我清楚，你希望得到紫色，黃色，黑色和橙色字段佔據窗口寬度的100％？ –

紫色，黃色，黑色。橙色不。我做了高度：自動但沒有滾動條可見。因爲div伸展到瀏覽器。 – Elisabeth

對於問題1： 如果你想有一個滾動條，你不應該設置高度屬性爲自動。相反，你可以通過這樣的Javascript動態設置Div高度。

document.getElementById("ListData").style.height=<your Size>;

問題2： 如果要高度設置爲紅色事業部。你可以像這樣指定。

height: 200px; 
overflow:hidden;

這將限制div爲200px。現在你可以增加你的其他div/div寬度來佔據這個空間。

來源

2012-06-11 14:43:17

來沒有JavaScript！爲什麼我應該將高度設置爲200px以使水平空間工作？請再讀一遍我的問題。 – Elisabeth

如果我從頭開始做這樣的事情，我會重新考慮佈局，所以我沒有這麼嚴格的限制，但是當您轉換現有網站時，我很欣賞這可能不是一個選項。

您可以使用display: table;,display: table-row;和display: table-cell;聲明得到一個語義上正確的（它不是表格數據，對吧？）結構，其行爲就像經常被誤用的<table>。無可否認，您必須爲IE6 & 7（大概2-3％的用戶）實施一些解決方法，但是也許您可以接受它在這些瀏覽器中可用但不完善？

http://www.digital-web.com/articles/everything_you_know_about_CSS_Is_wrong/

來源

2012-06-14 00:49:03

無法將css div垂直和水平拉伸100％

回答

相關問題