inline-blcok 將對象自身解析為 行内元素，和旁邊的 行内元素一起被顯示在同一行内，但是該對象裏面的内容則為呈現為 塊級元素。

引用：http://dancewithnet.com/lab/2008/examples-of-display-inline-block/#demo-1

利用{display:inline-block;}的特性可以实现行内元素具有固定的高度，这一属性已经在FireFox3 beta、IE8 beta、Opera、Safari中得到广泛的支持，IE6/7中可以利用{display:inline;zoom:1}等方法模拟,Firefox2中需要用其专有属性{display:-moz-display-box;}或{display:-moz-display-stack;} ，利用{text-indent:-9999px;overflow:hidden;}来隐藏inline-block元素中溢出的文字，但是Firefox2下需要再加上{font-size:0;}，然后利用background属性来实现图片的显示。

　　在工作中，常遇到一個問題：垂直對齊。常用的方法，就是在每行的後面清楚浮動。使用＜br class=”clearfloat” /＞這樣的寫法，雖然語義不會太差，但如果要修改的話就得改HTML結構，3張圖為一行？4張圖為一行？當然，可以得多寫一些代碼用來判斷，一開始是由另一個同事用 ASP寫，後來，我試着JS來寫，判斷多少個元素之後插入＜br class=”clearfloat” /＞，就不用在HTML裏寫了，要修改的話，就改腳本。
　　在元素後面清楚浮動的方法經常見到。這個方法兼容性好，結構清晰，就是每次使用都得要加腳本代碼。而今天，在藍色經典上面看到一篇譯文《跨浏览器的inline-block》用文中的方法可以解決 非表格的產品展示、圖片展示效果中所出現的垂直對齊問題。單用CSS就可以，兼容性好，且不用腳本，如果要挑不足的話，就只有為了修正FireFox2的一個小BUG，而額外多加一個div。

　　另外，文中主要講述如何 跨瀏覽器使用inline-block 來解決問題，講述得很詳細，還涉及到其它的知識點，是一篇直得看的譯文。