在IE5.5,6下,如果一个元素向左浮动(float:left),且添加了向左空白边(margin-left:10px)。那么会自动的加一倍变成20px。
如下html:在IE5.5,6下测试会发现marginLeft变成了20px
<style type="text/css">
#div2{
margin:0 0 0 10px;
float:left;
width:300px;
height:50px;
border:1px solid gray;
}
</style>
<div style="border:1px solid red;">
<div id="div2">
IE6双空白边bug
</div>
<div style="clear:both;"></div>
</div>
解决方法是给#div2加:display:inline,当然只针对IE6一下,可以使用下划线加属性_display:inline,这样只有IE6能识别了。
ps:边距翻倍只有当元素的边距碰到包含块时才发生。当一个元素被浮动到另一个浮动元素时不会翻倍。另marginTop和marginBottom都不会翻倍。
分享到:
相关推荐
描述:“9个最常见的IE6 Bug,快解决头疼的IE6吧” 在本文中,我们将深入探讨IE6中最为常见的九个Bug,并提供相应的解决方案,帮助Web开发者们解决这个曾经令人头疼的问题。 ### 1. 居中布局问题 在CSS布局中,将...
在IE6下(标准模式/怪异模式) 一个元素向左浮动(float:left),...IE6双空白边Bug</title> </head> <body> <div xss=removed> <div id=”d1″ style=”margin:0 0 0 10px;float:left;border:1px s
以下是一些针对IE浏览器的CSS常见bug及解决策略: 1. **浮动元素的双倍margin问题**: 在IE6中,如果一个浮动元素设置了margin属性,可能会导致实际的外边距比预期的要宽一倍。为了解决这个问题,可以将浮动元素的...
### 最常见的9种IE_css_bug及fix:深入解析与解决方案 #### 1. 居中布局问题 在Web开发中,将元素居中是极为常见的需求。通过设置`margin: auto;`通常能够轻松实现这一目标,但在IE6中,这种方法却会遇到问题。...
在Web开发领域,Internet Explorer(IE)曾是程序员们的一大挑战,尤其是对于前端开发者来说,因为IE中存在许多特有的bug。这些bug不仅让开发者头疼,还严重影响了开发效率。本篇将详细介绍9个最常见的IE bug及其...
以下是一些关于IE6兼容性和bug的详细解释及其解决方案: 1. **IE6怪异解析模式**:在没有文档声明的情况下,IE6会采用非标准的盒模型解析布局。为解决这个问题,应在文档开头添加`<!doctype html>`声明,使浏览器...
在网页设计领域,IE6(Internet Explorer 6)双倍边距问题是一个历史悠久且让开发者头疼的兼容性问题。这个现象特指在IE6浏览器中,如果一个元素同时设置了浮动(float)属性和外边距(margin),那么在实际渲染时,这个...
标题中的“margin值在IE6变成双倍”指的是在Internet Explorer 6(简称IE6)浏览器中,当设置元素的外边距(margin)时,可能会遇到一个知名的兼容性问题,即所谓的“双边距问题”(Double Margin Bug)。这个问题主要...
前几天写的一段Vue,在ie下一片空白,f12显示script1003: expected : 。于是就有了这篇文章… 解决过程 baidu、google之,说是json最后一项有多余的逗号,例如 { a: 5, b: 4, // 最后一项不能有逗号 } 检索修正...
**问题描述**:在IE6和IE7中,`img`标签后若有空白字符,会导致图片下方出现额外的空白空间。 **解决方案**:通过设置`img`的`display`属性为`block`来解决。 ##### 9. 失去`line-height`效果 **问题描述**:在IE...
以下将详细介绍IE6中常见的几个BUG及其解决方法,包括DIV中背景图片下方出现的3px空白间隔问题、双倍浮动BUG、注释引起的文字错位BUG以及著名的3px间隙BUG。 1. DIV中背景图片下方的3px空白间隔问题 在IE6中,当...
6. **更新浏览器**:鼓励用户升级到较新版本的浏览器,以获得更好的PNG透明度支持和更少的兼容性问题。 7. **备用方案**:对于仍然遇到问题的旧版IE用户,可以提供一个降级的非透明PNG图像或使用其他CSS技巧,如`...
当一个`float`元素旁边还有一个非`float`元素时,在IE6/7中可能会出现一个3像素的空白区域。解决方法是为`float`元素添加负的`margin-right`。 ```css #left { float: left; width: 50%; } *html #left { /*...
### IE6常见bug及其解决方法 #### 一、IE6怪异解析之padding与border算入宽高 **问题描述**: 在没有指定文档类型声明的情况下,IE6会使用其特有的“怪异模式”(Quirks Mode)来解析页面布局。在这种模式下,元素...