100％的孩子的div在不同的行

我怎樣才能做到這一點？如果我使用40％的2個孩子divs正確對齊。

我不是要求浮動解決方案。我只是想知道爲什麼這不起作用。

2012-03-22 danidacar

而是採用顯示：inline-block的，嘗試浮動：左到兩個小孩和父母？ – mshsayem 2012-03-22 10:39:53

我希望集中divs，所以浮動是不可能的。 – danidacar 2012-03-22 10:41:08

中心浮動DIV看到第一個答案：http://stackoverflow.com/questions/9696978/css-fixing-an-element-besides-another/9697173#9697173 – mshsayem 2012-03-22 10:42:13

你必須使用浮動div。地址：

float: left;

，並停止浮動行空div的末尾添加財產：

clear:both;

2012-03-22 10:41:06

我更新了我的答案。浮動不是答案。 – danidacar 2012-03-22 10:42:14

簡單：

但是，當使用內聯塊時，換行符/空白將在元素之間引入一個「間隙」，因此50px + 50px +「gap」=大於父寬度，強制孩子換行到另一個之下，而不是坐在旁邊。

避免這種差距，千萬不要把空白：

<parent> 
    <child>foo</child><child>bar</child> 
        ^^^--no gap, whitespace or newline between

通常

，我不喜歡這樣的列表項，以便關閉和開啓無空白：

<ul> 
    <li> 
     item 
    </li><li> //close and open immediately, no gaps 
     item 
    </li><li> 
     item 
    </li> 
</ul>

2012-03-22 10:42:09 Joseph

任何解決方案，以避免單行上的HTML代碼？ – danidacar 2012-03-22 10:44:49

更新了答案。在孩子的內部換行是沒有問題的，只是彼此之間沒有關係。 – Joseph 2012-03-22 10:45:23

@danip，你可以分開評論：'...

<！ - NEWLINE - >

..' - 但這是醜陋的。 – TMS 2012-03-22 10:59:20

顯示：內嵌塊總是從右側留出一些間距。因此，我們可以用font-size:0刪除，word-spacing:1em，letter-spacing:1em那裏parent.Write這樣的：

.parent {font-size:0;} 
.child {font-size:15px}

2012-03-22 10:42:12 sandeep

回答