2011-09-21 77 views
2

在我的項目中,我需要實現一個應該有未知(無限)寬度的容器div,如果它的寬度通過瀏覽器的窗口溢出,則不會破壞新行。無限Div寬度?可能嗎?

容器div有的(空白:NOWRAP;顯示:內聯)的CSS屬性和這裏面div有(浮動:左)的組件的CSS屬性。所有寬度都是靜態設置的。爲了測試行爲,我使用了一個按鈕,它調用一個在容器div內附加一個組件的javascript函數。

的問題是,當容器div的總寬度增加到大於瀏覽器的窗口寬度,div容器內部的部件將打破到新的一行。我想知道是否有可能擁有無限寬度的div?

許多謝謝..

回答

4

white-space: nowrap財產不適用於浮動元素。簡單地說,當你將一個元素向左或向右浮動時,之間沒有空白

對什麼白色空間的更多信息,並且明確規定你不能用浮漂做這個行見white-space (CSS property)

儘量將它們設置爲display: inline-block,使家長真正認爲它們的內容。

+0

我看..現在我意識到,空間屬性只適用對於文本(我是對的?)...所以,你對我的問題有什麼建議嗎?即使容器div的寬度通過瀏覽器的窗口溢出,如何避免換行符?謝謝.. – Abou

+0

@Abou:請參閱[本示例](http://jsfiddle.net/sT2DV/)關於使用'display:inline-block'來代替。所有你必須擔心的是確保每個元素之間沒有換行符和空格,以便它們之間不會出現多餘的空間。 – animuson

+0

這裏是[另一個例子](http://jsfiddle.net/sT2DV/1/)沒有換行符和空格。 – animuson

0

嘗試添加特定高度的div容器,或移除在div內部組件的float: left規則。

+0

我已經專門設置了div的高度,依然不起作用。和浮動:左,我認爲它應該設置,如果不是,容器內的div不會在一行中流動..恕我直言.. – Abou