2013-04-30 78 views
3

假設您有n 在容器中浮動 div。你如何使它們之間的空間(邊距)自動相等?它應該支持窗口大小調整事件。divs之間的相等邊距

如果需要,我可以使用JQuery,但我寧願它是純html/css。 謝謝

+1

我蘇爲了填補集裝箱,這意味着這些div應該調整它們的利潤率。 – MaxArt 2013-04-30 21:29:33

+1

因爲它是強制性的,所以'display:table'是沒有問題的。無論如何,在JS中,只要你知道每行你想要多少個div,就很有可能。因此,您可以抓取容器和每個div的innerWidth(),除以您設置的每行div的數量,然後計算每個div的邊距。如果沒有其他人回答,我可以嘗試爲您編碼。無論如何,嘗試閱讀[這個答案](http://stackoverflow.com/a/10550660/684932),它可能會幫助你。 – RaphaelDDL 2013-04-30 21:33:26

回答

3

簡單!爲他們辯護! (僅使用CSS

:不要把它們飄浮,飄浮是你應該在很多情況下做的最後一件事。

下面是一個例子: DEMO PAGE

HTML

<ul> 
    <li>item 1</li> 
    <li>item 2</li> 
    <li>another item</li> 
    <li>and another</li> 
</ul> 

CSS

ul{ width:100%; text-align:justify; } 
ul::after{ content:''; display:inline-block; width:100%; } 
    ul li{ display:inline-block; } 
+0

我不明白爲什麼很多設計師會繼續使用浮動元素。他們比別的更麻煩。 – MaxArt 2013-04-30 21:33:14

+0

這很好,也許我應該放棄浮動 – 2013-04-30 21:33:24

0

div { float: left; margin-left: 5%; }