可以看到，我本來是想要兩行，每一行是三張。結果現在第一行的跑到第二行去了。
**結構很簡單：
其中a標籤設定了display：inline-block
1111
2222
我把粉色的寬度調小一點，19%。再試試！
發現這兩個塊之間的有個白色的小空隙了吧？為啥會有空白呢？
因為：發明html的人是老外，老外使用空格作為單詞之間的間隔的。inline-block 就像乙個個的單詞，剛剛的**不是換行了嗎？噯～html還有乙個空白字元壓縮的特點，你換行也好，tab也好，多個空格也好，都會壓縮成乙個空格（還記得當年初學前端時遇到空格不生效只能用 ；的時候嗎）。
現在知道問題的原因了，那麼怎麼解決呢？
1、不換行
1111
2222
2、給父元素設定font-size：0
缺點：子元素如果需要字型的話，會需要重新在子元素新增fon-size的設定。但如果像我一樣是不需要文字的話，就很完美了。
3、不用inline-block改為float
float是忽略空白符的，不過你的css布局可能要重新花一下心思，可能會涉及到清除浮動之類設定。
4、word-spacing屬性
5、white-space-collapse
《css3 text effects module**》中就有了「white-space-collapse」屬性，用來設定或者檢索元素內包含的空白字元。有如下取值：
所以解決辦法是：white-space-collapse:discard
但是，由於該屬性本身存在的諸多問題以及瀏覽器廠商沒有及時跟進和實現,所以根本用不了。希望這個屬性快快上架啦～～
如何移除inline block元素之間的空白
我們想要的是元素可以緊貼在一起，但是很顯然，結果 出乎意料 那麼有什麼方法可以讓結果符合我們的預期呢？所能想到的解決方法至少有以下四種，而每種方法也都有其優劣所在，至於要如何選擇，就需要取決於實際情況。之所以有空白，是因為元素之間存在空格 連續多個空格 換行符 製表符在html中都認為是乙個空格 那...
去除inline block元素間距
現象 當使用inline block的時候，元素間會出現4px的間距 在chrome裡面 是8px 如下圖 原因 元素間留白間距出現的原因就是標籤段之間的空格 解決方法一 既然間距是因為標籤間的空格造成的，那麼消除空格就可以消除間距，但是這一類方法都不符合常規的 書寫習慣，所以 不推薦春天 夏天秋天...
去掉inline block元素間隙
目錄 1 標籤寫在一行，移除標籤間的空格 2 利用html注釋標籤 3 在父容器上使用font size 0 可以消除間隙 做頁面時，如果用到inline block元素來布局，就無可避免都會遇到乙個問題，就是inline block元素之間的間隙。這些間隙會導致一些布局上的問題，需要把間隙去掉。我...