display:inline;与float:left; 区别

*{text-align:center;padding:4px;}
div,p{text-align:left;}
span{/*float:right;*/ background:#f5f5f5;border-left:1px #eee solid;border-top:1px #eee solid;border-right:1px #ccc solid;border-bottom:1px #ccc solid;}
ul#inline li{ display:inline; list-style:none;border-left:1px #ccc solid;width:300px; background:#f5f5f5;/* float:left*/;}
ul#float li{ float:left;display:inline; list-style:none;border-left:1px #666 solid;width:300px; background:#f5f5f5; }

span为内联/inline元素，给他宽度赋值是没有效果的。
span为内联/inline元素，给他宽度赋值100px+float:right;可以看到有了宽度。

这个li被定义为内联/inline,设置宽度没有效果

test

test

这个li被定义为内联/inline+float:left,设置宽度有效果

test

test