码迷,mamicode.com
首页 > 其他好文 > 详细

浮动后IE6双倍边距问题

时间:2019-11-13 16:00:45      阅读:71      评论:0      收藏:0      [点我收藏+]

标签:问题   pad   round   意义   oct   ext   设置   class   padding   

IE6的双倍边距bug

 在IE6中,当为一个向左浮动的元素设置左外边距时,这个外边距将会是设置值的2倍

 

1,添加一个样式来解决ie6的双倍边距问题

对于一个浮动元素来说设置display:inline没有任何意义

但是该属性可以解决IE6的双倍边距问题

display:inline;

2,或者为IE6单独设置外边距

_margin-left:50px,边距设为其他浏览器的一半

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         <style type="text/css">
 7         /*清除外边距*/
 8         *{
 9             margin: 0px;
10             padding: 0px;
11         }
12             .box{
13                 background-color: yellow;
14                 width: 100px;
15                 height: 100px;
16                 /*设置浮动*/
17                 float: left;
18                 
19                 /*解决办法1,为IE6单独设置一个外边距*/
20                 margin-left: 100px;
21                 /*_margin-left:50px*/
22                 
23                 /*解决办法2,设置一个样式*/
24                 display: inline;
25             }
26         </style>
27     </head>
28     <body>
29         <div class="box"></div>
30     </body>
31 </html>

 

浮动后IE6双倍边距问题

标签:问题   pad   round   意义   oct   ext   设置   class   padding   

原文地址:https://www.cnblogs.com/xuanxuanya/p/11849758.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!