如何安排無間隙

Question

長方形格箱我已經安排在2×2格這四個div標籤（中間一個只爲換行）

<div class="rectangle"></div> 
<div class="rectangle"></div> 

<div class=""></div> 

<div class="rectangle"></div> 
<div class="rectangle"></div> 

隨着這個CSS：

.rectangle { 
    width: 25px; 
    height: 25px; 
    background: #ccc; 
    display: inline-block; 
    margin: 0px; /* doesn't work */ 
    padding: 0px; /* doesn't work */ 
} 

的jsfiddle結果輸出顯示矩形之間的間隙。有沒有辦法擺脫差距？

http://jsfiddle.net/brMPs/958/

Answer 1

你既可以漂浮留下的矩形或零出字體大小DIV標籤之間的隱祕空間。在這裏，試試這個添加div容器和使用

.container { 
    font-size: 0; 
} 

http://jsfiddle.net/brMPs/963/

Answer 2

你的空間是因爲，你具備的要素（換行和一些標籤算作之間的空間的原因空間，只是要清楚）。最小化的HTML會解決這個問題，還是這些招數之一：

<div class="rectangle"></div><div 
class="rectangle"> 
</div> 

<div class=""></div> 

<div class="rectangle"></div><div 
class="rectangle"> 
</div> 

https://css-tricks.com/fighting-the-space-between-inline-block-elements/