`
heyJoe
  • 浏览: 27902 次
  • 性别: Icon_minigender_1
  • 来自: 西安
最近访客 更多访客>>
社区版块
存档分类
最新评论

IE6的双边距BUG

    博客分类:
  • CSS
 
阅读更多

也被叫做双边距bug。

 

在ie6中, 元素设置了float: left/right属性, 还设置了margin-left/right: ?px属性, 那么实际显示出来的margin将会是实际设置长度的2倍。

 

在ie6中, bug的出现也是有一定的条件的, 经过测试, 如果设置float的元素不是在屏幕的最左/右边话, 将不会发生。

 

测试代码会在以后加上

 

分享到:
评论

相关推荐

    DIV+CSS浏览器兼容方法的总结

    - 当一个元素设置了`float`属性并且具有`margin`时,在IE6中可能会出现双边距bug。 - 解决方案是将`float`元素的`display`属性设为`inline`。 - 示例代码: ```css div { float: left; margin-left: 10px; ...

    浏览器兼容代码大全

    IE6存在一个双边距Bug,在某些情况下,浮动元素的左边距会比预期的大一倍。通过将浮动元素的`display`属性设置为`inline`,可以有效地避免这个问题。 ##### IE6 图像透明背景问题 1. 使用GIF格式的图像替代PNG格式...

    前端开发面试题.pdf

    - IE6双边距bug:可以使用`_display:inline;`修复。 - 渐进增强和回退策略:使用条件注释或CSS hack处理不同IE版本的差异。 - 自定义属性和事件对象属性:统一使用`getAttribute()`获取自定义属性,并处理`event`...

    2015前端面试题(含答案)1

    - **IE6双边距bug**:浮动元素的宽度计算问题,可使用负margin或`display:inline-block`解决。 此外,前端开发者还需了解: - **Web标准**:理解W3C标准,关注语义化HTML和CSS规范。 - **浏览器内核差异**:处理...

    前端开发面试题整合(css、js、vue。react等)

    * IE6 双边距 bug:块属性标签添加了浮动 float 之后,若在浮动方向上也有 margin 值,则 margin 值会加倍。 * 上下 margin 重合问题,相邻的两个 div margin-left margin-right 不会重合,但相邻的 margin-top ...

    前端工程师面试题

    - IE6双边距Bug,即浮动物体的横边距加倍问题,可通过设置`_display:inline`解决。 - 获取自定义属性时,统一使用`getAttribute()`方法以确保兼容性。 - 鼠标事件的位置属性在不同浏览器中的命名差异,需分别处理...

    iebug总结jar包

    5. **双边距问题**:在IE6中,浮动元素的内联元素会额外增加一个像素的边距,可通过负margin或者`display:inline-block`来修复。 6. **CSS选择器限制**:IE6不支持一些高级CSS选择器,如`:hover`在非链接元素上、`:...

    前端面试题汇总

    - **兼容性问题**: 如IE6双边距BUG。 - **解决方法**: 使用条件注释或特定浏览器的CSS Hack。 **44. display属性** - **值**: `block`, `inline`, `inline-block`, `flex`, `grid`等。 - **作用**: 控制元素的显示...

    网页排版IE6兼容性问题修改方法

    当元素设置为`display:inline-block`时,IE6会出现双边距bug,可以通过设置`display:block`或`zoom:1;`(触发hasLayout)来消除。 5. **hasLayout机制** IE6特有的hasLayout机制,当元素满足某些条件时,会自动...

    CSS之IE BUG分析与解决

    3. **浮动元素的双边距** - IE6在某些情况下会给浮动元素的左侧或右侧添加额外边距。通过设置`display:inline`或`float:none`可以解决这个问题。 4. **相对容器中的绝对定位** - IE6在处理绝对定位时有时会出现...

    css_bug与解决方法

    当元素设置为`float`后,在IE6/7中会出现margin双边距问题,即元素的左边距或右边距被加倍计算。这种现象在示例代码中通过设置`float:left`和`margin-left:10px`得以体现,IE6/7下实际应用的`margin-left`值会超过...

    margin值在IE6变成双倍

    标题中的“margin值在IE6变成双倍”指的是在Internet Explorer 6(简称IE6)浏览器中,当设置元素的外边距(margin)时,可能会遇到一个知名的兼容性问题,即所谓的“双边距问题”(Double Margin Bug)。这个问题主要...

    ie6十大兼容性问题

    IE6中的一个常见问题是浮动元素的边距加倍问题,即所谓的 “双边距 bug”。为了解决这个问题,可以将浮动元素的 `display` 属性设置为 `inline`。 **示例:** ```css #floatElement { float: left; display: ...

    IE6常见bug附解决方法

    doctype html> 2、IE6在块元素、左右浮动、设定marin时造成margin双倍(双边距)解决方法:display:inline 3、以下三种其实是同一种bug,其实也不算是个bug,举个例子:父标签高度20,子标签11,垂直居中,20-11=9...

    网站布局--前端布局之BUG堆积如山.rar

    布局中,IE6的兼容性是比较令人头疼的,对于3像素BUG、margin双边距、下拦菜单被选择框摭住、躲猫猫BUG、边框线右若隐若现情况啊、、、、等等的产生机理,都有详细分析,有兴趣的童鞋可以看下以做参考。相信会在实际...

    IE6下兼容性常见的几个问题与解决方法

    第七个问题,IE6的双边距bug,横向margin值会被放大两倍。使用display:inline可以修复这个问题,使元素不被视为块级元素,从而避免边距加倍。 最后,问题八涉及到IE6下的外边距消失。当父元素宽度和内容宽度差异...

    前端入门10个css bug顺口溜

    1. **双边距问题:** IE浏览器中,当浮动元素内部包含绝对单位(如`px`)的`margin`时,可能会出现双边距问题,即实际外边距比预期大。 2. **解决方法:** 将浮动元素设置为`display: inline`可以避免双边距问题,...

    浏览器兼容性问题1

    5. **浮动bug**:包括3px像素空隙、浮动元素的宽度计算、浮动元素折行以及双边距bug等,这些都是IE6和IE7中的常见问题,需要特别处理。 6. **定位问题**:在IE6中,绝对定位元素的位置可能出现1px的偏差,同时浮动...

    DIV+CSS解决各浏览器兼容问题

    IE6存在一个著名的双边距BUG,即当元素设置为`float`属性后,其左右`margin`会出现加倍现象。解决此问题可以通过添加!important声明来覆盖IE6的错误计算: ```css margin-left: 10px !important; /* IE7, IE8, FF ...

Global site tag (gtag.js) - Google Analytics