ie下的3像素和双倍bug问题

来源：互联网发布：手机截取在线视频软件编辑：程序博客网时间：2024/06/02 11:48

ie6浏览器常见的兼容问题，margin 3px 和双倍间距问题

做了一下测试，这两个bug都是由于设置了浮动导致的。

其中一个div设置了浮动，另一个没有设置为浮动导致而成，同一行内都设置浮动也可以解决。

有问题的代码:

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title>ie6下面的margin   3px像素问题</title>    <style> body{margin:0;}.left{width:200px;height:200px;background:#99ff99;float:left;/*margin-right:10px;*/}.left2{width:200px;height:200px;background:pink;/*float:left;*/}    </style></head><body><div class="left">left</div><div class="left2">left2</div></body></html>

正常显示的代码

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title>ie6下面的margin   3px像素问题</title>    <style> body{margin:0;}.left{width:200px;height:200px;background:#99ff99;float:left;/*margin-right:10px;*/}.left2{width:200px;height:200px;background:pink;float:left;}    </style></head><body><div class="left">left</div><div class="left2">left2</div></body></html>

对于双倍间距，也是这个问题

第二个元素也浮动显示的图片是：

3像素的问题就解决了但是双倍bug还没有解决

解决方法：

.left{width:200px;height:200px;background:#99ff99;float:left;margin:10px 10px 10px 10px;display: inline;}

于是就 O 啦

0 0