IE6的双边距BUG

最新推荐文章于 2020-10-12 10:59:40 发布
最新推荐文章于 2020-10-12 10:59:40 发布 · 169 阅读 · 0

本文解析了IE6浏览器中的双边距bug现象，当元素同时设置了浮动和左右外边距时，实际显示的外边距会变成设置值的两倍。此bug在元素位于页面最左侧或右侧时更为明显。

也被叫做双边距bug。

 

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

 

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

 

测试代码会在以后加上

 

如何解决IE6双倍margin的Bug？
My_wife_QBL的博客
07-10 1143
在网页设计和开发的历史中，Internet Explorer 6（简称IE6）是一个不可忽视的存在。尽管IE6已经是一个过时的浏览器，但在某些情况下，我们仍然需要考虑如何解决它在CSS布局中的一些特定问题，尤其是著名的“双倍margin”Bug。本文将详细介绍IE6双倍margin Bug的原因、影响以及解决方法，并通过实例帮助读者更好地理解和应用。
IE6常见bug附解决方法
09-25
#### 二、IE6中的Margin加倍问题（双边距） **问题描述**： 当在IE6中对一个块级元素应用`float`属性，并且设置了左右`margin`时，可能会出现实际`margin`比预期大的现象，这种现象通常被称为“双边距”或“双倍`...
IE6中用了float:left之后导致margin-left双倍边距的BUG解决方法
zyjwy02
12-22 205
先看css代码: div {    float:left;        margin-left:10px;        width:420px;        height:150px;        border:1px solid red        }这样设置左边距设置为10px，但IE6.0解释为20px，解决办法就是是加上display:inline 代码 div {    fl...
IE6下的双边距BUG
似水流年
03-31 467
body{margin:0;} .wrap{float:left;border:2px solid #000;} .box{width:100px;height:100px;background:red;margin:0 100px;float:left; } /* IE6下的双边距BUG 在IE6下，块元素有浮动和横向margin的时候，横向的margin值会被放大成两倍; 解决办法
IE6双边距BUG演示及解决方法
ZH2357710792的博客
04-07 256
IE6双边距bug演示 　　当为一个块级元素同时设置float和margin属性时，在IE6下元素的margin显示效果为原来的2倍。 　　简单的例子： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>D...
IE6的双边距Bug以及解决办法
happyqyt的专栏
03-18 444
bug描述：就是你明明设置margin-left为10px，但是在IE6下显示的左边距却是20px。 bug出现的条件：当浮动元素的浮动方向和外边距的设置方向一致且浮动元素靠近浮动边界时才会出现。比如元素向左浮动时设置左边距，并且为一行中的第一个浮动元素时会出现这个bug，同样，向右浮动时设置右边距，且为一行中的最后一个浮动元素时也会出现这个bug。 bug的解决办法：给浮动元素块加上disp...
IE6下float双边距问题
dazwxrt0338的博客
08-26 185
当浮动元素的方向和设置margin的方向相同时，就会出现双边距问题，解决方法是： 删除浮动，改成display:inline-block _display:inline; _zoom:1; 转载于:https://www.cnblogs.com/sunhk/p/4760982.html...
IE6下兼容性常见的几个问题与解决方法
09-24
第七个问题，IE6的双边距bug，横向margin值会被放大两倍。使用display:inline可以修复这个问题，使元素不被视为块级元素，从而避免边距加倍。 最后，问题八涉及到IE6下的外边距消失。当父元素宽度和内容宽度差异...
iebug总结jar包
04-08
5. **双边距问题**：在IE6中，浮动元素的内联元素会额外增加一个像素的边距，可通过负margin或者`display:inline-block`来修复。 6. **CSS选择器限制**：IE6不支持一些高级CSS选择器，如`:hover`在非链接元素上、`:...
解决IE6下margin双倍边距问题
Akay的Web技术博客
04-23 2241
     问题：在IE6下如果某个标签使用了float属性，同时设置了其外补丁“margin:10px 0 0 10px”可以看出，上边距和左边距同样为10px，但第一个对象距左边有20px。     解决办法：当将其display属性设置为inline时问题就都解决了。     说明：这是因为块级对象默认的display属性值是block，当设置了浮动的同时，还设置了它的外边距就会出现这
浏览器兼容性经典问题（一） IE6 下双边距问题
speed_feng的专栏
11-15 8092
问题描述：         一个div盒子如果设置了margin，并且该div设置了float浮动，那么在IE6下便会产生双边距问题：如果设置 float:left 那么左边距会是原来margin的两倍；如果是float:right，那么右边距会是原来margin的两倍。         代码如下：
前端常见的浏览器兼容性问题及解决方案
weixin_30659829的博客
09-14 442
常见的兼容性问题： 1、不同浏览器的标签默认的外补丁( margin )和内补丁(padding)不同 解决方案： css 里增加通配符 * { margin: 0; padding: 0; } 2、IE6双边距问题；在 IE6中设置了float , 同时又设置margin , 就会出现边距问题 解决方案：设置display:inline; 3、当标签的高度设置小于10px，...
前端浏览器兼容性问题总结
qq_25194685的博客
10-12 531
市场上浏览器种类很多，不同浏览器的内核也不尽相同，所以各个浏览器对网页的解析存在一定的差异。浏览器内核主要分为两种，一是渲染引擎，另一个是js引擎，内核更加倾向于说渲染引擎。 常见的浏览器内核可以分四种：Trident、Gecko、Blink、Webkit IE浏览器：Trident内核，也称为IE内核 Chrome浏览器：Webkit内核，现在是Blink内核 Firefox浏览器：Gecko内核，俗称Firefox内核 Safari浏览器：Webkit内核 Opera浏览器：最初是自己的Presto内核
前端如何解决浏览器的兼容问题
lff18277233091的博客
02-20 540
转载于 不同浏览器的内核也不尽相同，所以各个浏览器对网页的解析存在一定的差异。 浏览器内核主要分为两种，一是渲染引擎，另一个是js 引擎，内核更加倾向于说渲染引擎。 常见的浏览器内核： 不同浏览器的默认样式存在差异，可以使用 Normalize.css 抹平这些差异。 1.不同浏览器的标签默认的外补丁和内补丁不同 问题症状：随便写几个标签，不加样式控制的情况下，各自的margin 和padding...
优化调度基于改进遗传算法的公交车调度排班优化的研究与实现（Matlab代码实现）
12-01
【优化调度】基于改进遗传算法的公交车调度排班优化的研究与实现（Matlab代码实现）内容概要：本文围绕“基于改进遗传算法的公交车调度排班优化”展开研究，利用Matlab实现算法仿真与优化过程。文章重点介绍如何通过改进遗传算法（如引入精英策略、变异优化等）提升传统算法在公交调度这一复杂多目标优化问题中的性能，解决发车频率、线路分配、司机排班及运营成本之间的平衡问题。研究涵盖了实际调度中的多重约束条件，包括时段客流波动、车辆数量限制、工作时长合规性等，并通过仿真实验验证改进算法在收敛速度、解的质量和稳定性方面的优越性。; 适合人群：具备一定Matlab编程基础和优化算法知识的研究生、科研人员及从事公共交通系统规划与智能调度的工程技术人员。; 使用场景及目标：①应用于城市公交系统排班优化，提升运营效率并降低人力与能源成本；②作为智能交通系统（ITS）中调度模块的技术参考；③为遗传算法在实际工程问题中的改进与应用提供案例支撑。; 阅读建议：建议读者结合文中Matlab代码进行实践操作，重点关注算法改进策略的设计逻辑与调度模型的构建方式，同时可尝试将算法扩展至其他交通调度场景以深化理解。
中国臭氧站点数据集(2024).zip
12-01
1. station_2024.csv —— 全国地面站点位置信息 2. O3_data_2024.csv —— 全国 O₃ 小时浓度数据
（64页PPT）某著名企业集团年会活动策划方案.ppt
最新发布
12-01
（64页PPT）某著名企业集团年会活动策划方案.ppt
【嵌入式系统】基于GCC优化与组件裁剪的固件瘦身方法：面向STM32/ESP32/nRF52平台的低资源部署方案设计
12-01
内容概要：本文系统介绍了嵌入式固件裁剪与优化的实战方法，重点围绕编译器级优化（如GCC的-Os、-flto、--gc-sections等选项）、主流芯片平台（STM32、ESP32、nRF52）的具体瘦身流程以及工具链实践展开。通过对比不同优化配置下的固件大小、执行效率和编译时间，验证了-Os结合LTO与段裁剪可显著减小体积，同时提供了HAL库裁剪、启动文件优化、分区表调整、调试信息移除等关键操作步骤，最终实现固件体积大幅缩减。; 适合人群：具备嵌入式开发经验的工程师，尤其是从事MCU固件开发、资源受限设备优化及相关技术研究的1-3年工作经验人员；熟悉C/C++语言及基本编译链接原理者更佳； 使用场景及目标：①在存储空间紧张的嵌入式设备中最大化压缩固件体积；②提升代码执行效率并合理平衡调试能力；③掌握跨平台（STM32/ESP32/nRF52）固件优化通用方法论； 阅读建议：建议结合具体项目实践文中优化策略，逐步应用编译器选项、组件裁剪与链接脚本修改，并借助size、objdump、strip等工具分析优化效果，注意避免过度优化带来的稳定性风险。
STM32实现PT100测温系统V4.0（4针OLED显示）
12-01
提供了基于STM32微控制器的PT100测温系统完整解决方案。PT100是一种常见的铂电阻温度检测器，广泛应用于工业温度测量领域。此项目实现了利用STM32精确采集PT100电阻值变化，进而转换并显示当前温度的功能。特别地，本系统通过4针OLED显示屏直观展示温度数据，提高了现场观察的便捷性和系统的可读性。 版本说明 版本: V4.0 更新日期: [请插入具体日期] 核心处理器: STM32系列（具体型号请参考源代码） 显示模块: 4针OLED显示屏 功能特点: 高精度PT100温度采集 实时温度数据显示 OLED屏幕友好界面设计 稳定的软件架构，易于扩展和修改 目录结构 仓库大致包含以下目录结构： . ├── Src # 源代码文件夹 │ ├── main.c # 主程序文件 │ └── ... # 其他相关源文件 ├── Inc # 头文件文件夹 │ ├── main.h # 主头文件 │ └── ... # 其余头文件 ├── Documentation # 文档资料 │ └── 用户手册.pdf # 项目使用指南 ├── Libraries # 第三方库或自定义库 │ └── OLED # OLED驱动库 └── STM32_project # IAR/Keil等开发环境工程文件 ├── STM32xxxxx.uvprojx # 开发工具工程文件 └── ... # 工程相关配置文件 快速上手 硬件准备：确保你
IE6绿色版：CSS布局调试神器
例如，IE6不支持CSS的很多特性，包括PNG透明度和IE特有的bug（比如双边距bug），这些都需要开发者特别注意。 #### 调试工具 在Web开发中，调试工具是用来帮助开发者检测和修复代码中的错误的软件。对于IE6，开发者...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值