HTML元素都需要有其內在的靜態內容的最小寬度

Question

與百分比寬度

HTML元素都需要有其內在的靜態內容的最小寬度

您好，我試圖創建一個流體/響應式佈局。有什麼辦法強制一個具有百分比寬度的html元素的內部內容的最小寬度？也就是說，如果它的內容有某種靜態寬度，比如200px？

下面是一個例子：http://www.nathanielkessler.com/div/csshelp.html

如果在IE9將它設置爲怪癖模式和進出調整窗口的大小，它的行爲完全像我想要的。 （注意當屏幕向內調整大小時，右側的第二個div如何在左側第一個div下方彈出）。

如果將文檔設置回IE9標準模式，然後調整內部大小，則會看到外部紅色邊框格不尊重其內容（黃色框）。我只是繼續縮小應該超出其邊界的範圍。
有沒有什麼辦法讓它的行爲就像在怪癖模式中那樣？ （沒有JavaScript）

Answer 1

謝謝，我結束了找到一個非常具體的CSS/html組合，給了我以後的行爲。適用於所有主流瀏覽器，包括ie7至ie 9.

基本上，在一排左側浮動元素中，如果給第一個元素設置最小寬度％，其餘元素爲最小寬度％ + width％...你會得到一個流體佈局，當瀏覽器窗口縮小時，強制元素放置在它們的兄弟元素下。

下面是一個工作示例，請嘗試調整瀏覽器的大小。 http://www.nathanielkessler.com/div/cssfluid.html

Answer 2

我想你想要的是min-width的CSS屬性。設置.item { min-width: 200px; }