我如何防止內容不超過容器的長度？

我在一個頁面上顯示客戶列表，在右側，我有一個日曆顯示安排新任命日期。當測試輸出時，我發現如果當天有很多客戶來到，那麼列表超出了容器的長度。怎樣處理這個..我如何防止內容不超過容器的長度？

一些代碼：

容器：

#container { 
background-color: #FFFFFF; 
margin:0 auto; 
min-height: 600px; 
width: 900px; 
border:0px solid #999999; 
margin-top:30px; 
font-size:15px; 
color: #000000; 
margin-bottom:60px; 
position:absolute; 
} 

#calendar { 
margin-left:400px; 
}

來源

2011-04-11 KPO

可以用[的jsfiddle（http://jsfiddle.net/）你展示你的代碼？ – thirtydot 2011-04-11 21:53:00

你能發佈html嗎？編輯：+1以上;） – Calum 2011-04-11 21:53:35

你想的#container在所有的擴大？

如果不是，則將min-height改爲height，並添加overflow：hidden;

更好的解決方案是修改提供數據的任何東西，以便在任何給定時間只接收預定數量的客戶端。

來源

2011-04-11 21:54:22 Todd

它沒有工作。它只將容器的高度擴大了0.5英寸。 – KPO 2011-04-11 21:56:56

是的，如果超過#container的長度，我希望#container展開到列表的長度。 – KPO 2011-04-11 22:01:01

我可以haz代碼？如果你能向我們展示你到底在做什麼，我相信我們將能夠幫助你。 – Todd 2011-04-11 22:20:44

是overflow: auto;你在找什麼？如果內容超出容器的大小，則會添加滾動條。

來源

2011-04-11 21:54:50 penguinrob

不，我是說容器包含這些客戶端的列表......但是這個列表超出了容器的長度，所以它會離開它。我怎麼能這樣做，使容器的高度適應列表的長度.. – KPO 2011-04-11 21:57:56

如果您從容器中刪除任何高度屬性，並且它不是一個固定的佈局或任何東西，containter *應*自動展開 – penguinrob 2011-04-11 22:00:33

試過。它仍然熄滅。 – KPO 2011-04-11 22:03:12

使用最小高度。例如：

min-height: 300px;

如果指定此樣式，則該元素將爲300px高或足夠高以包含其內容 - 以較高者爲準。

（請注意，並非所有Web瀏覽器與最小高度的工作。）

來源

2011-04-11 22:09:44 KatieK

我在上面發佈的代碼中使用了最小高度。我在Firefox上。 – KPO 2011-04-11 22:13:45

你是對的。你能發佈一些HTML代碼嗎？ – KatieK 2011-04-11 22:16:07

謝謝我認爲問題是在#container中的位置：絕對。我忘了將它複製到xample中。如果我刪除那個高度調整，但日曆一直下降。 – KPO 2011-04-11 22:18:52

我如何防止內容不超過容器的長度？

回答

相關問題