关于display:inline的具体应用
网络整理 - 07-27
display:inline定义和用法
display 属性：设置元素如何显示。
inline ：此元素会被显示为内联元素，元素前后没有换行符。
今天就和大家讲讲display:inline在编写CSS中的具体应用，我相信很多朋友都碰到过用DIV+CSS来编写网页代码的时候，明明Macromedia Dreamweaver里显示是正常的，但上传到FTP上用IE6来查看网站的时候却出现了div错位或是下移，这是什么原因呢？
我们平常用DIV+CSS编写网页的时候经常会用到float来定义元素在哪个方向浮动，当margin在设置float属性的情况下出现时，margin的值会加倍。这是一个在ie6中都存在的bug。
解决方案是在这个div里面加上 display:inline;
例如：
<style type="text/css">
html{ margin:0 auto; padding:0}
.body{margin:0 auto; width:366px; }
.box1{float:left; width:128px; height:128px; background:url(001.jpg); margin:0 0 0 50px;}
.box2{float:right; width:128px; height:128px; background:url(002.jpg);margin:0 0 0 50px;}
</style>
<body>
<div class="body">
<div class="box1"></div>
<div class="box2"></div>
</div>
</body>
看看IE6中的效果：
IE6中的效果
IE7和其它浏览器的效果：
IE7和其它浏览器的效果：