Question

多个div块显示在一行的问题

方法1：
<div style="clear:both">
<div style="float:left">
This is a test.
</div>
<div style="float:left">
This is a test 2.
</div>
</div>

方法2：
<div style="clear:both">
<div style="display:inline-block">
This is a test 3.
</div>
<div style="display:inline-block">
This is a test 4.
</div>
</div>

两者都可以实现，区别在什么地方呢？

Answer 1

inline-block: "将对象呈递为内联对象，但是对象的内容作为块对象呈递。旁边的内联对象会被呈递在同一行内，允许空格。" 考虑到兼容性问题，还是用第一种吧。

Answer 2

第一种是常规的方法，但是由于不同浏览器兼容性问题，会导致每个浮动块距离不同
第二种就是将对象呈递为内联对象，内联对象是不会换行的。这个属性并不是所有浏览器都支持的
总的来说，第一种常见一些。

Answer 3

inline-block 允许有空格
但是呢不是所有浏览器兼容
只有Opera，Safari，FireFox3和IE8支持

Answer 4

建议用第一种 如果考虑到兼容性问题 这个“display:inline-block”， 这个以后不要用了

Answer 5

IE较低版本 display:inline-block 没用的