display:inline-block 和 float:left的区别

比如一个 ul li 组成的 导航栏

<ul>
<li>Home</li>
<li>Tutorials</li>
<li>Podcast</li>
</ul>

#top_menu li {
/*make sur align li tag from left to right*/
float:left
/*some browsers has the 標識符, that can annul it*/
list-style:none;
padding:5px;
font: bold 14px Tahoma;
}

 

#top_menu li {
/*make sur align li tag from left to right*/
display:inline-block;
/*some browsers has the 標識符, that can annul it*/
list-style:none;
padding:5px;
font: bold 14px Tahoma;
}

display:inline-block ，inline-block会把父类Ul填满，