ie6/7中float失效主因是未触发haslayout，需在父容器加zoom:1等属性激活渲染；clear:both仅对标准流块元素有效，且前方须有已触发haslayout的浮动节点。
IE6/7中float元素不按预期浮动，先看hasLayout是否触发
IE6/7里float失效，十有八九不是CSS写错了，而是元素没触发hasLayout。这个内部渲染标志没开，float、margin、clear等行为都会错乱——比如元素明明写了float: left却还呆在原地，或者clear: both完全没反应。
触发hasLayout的常见方式有：zoom: 1、height: 1px、width: 100%、position: absolute等。其中zoom: 1最安全：它不改变布局，只激活渲染路径，且现代浏览器会忽略。
-
zoom: 1必须加在**父容器**上，才能让子浮动元素正常参与计算（比如清除浮动、边距渲染） - 如果子元素自己也要
hasLayout（如需clear生效），那它也得单独加zoom: 1或display: inline - 避免用
height: 1%这类“伪高度”，IE6在某些字体设置下可能误判为0，导致hasLayout未触发
clear:both在IE6/7里不生效，检查浮动源是否真实存在
clear: both只对标准流中的块级元素起作用，而IE6/7里如果目标元素本身也float了，或者前面根本没有真正渲染出来的浮动兄弟节点，它就直接失效。
- 确认
clear元素前面至少有一个**已触发hasLayout且实际渲染的浮动元素**（display: none或visibility: hidden的不算） - 别把
clear写在浮动元素自己身上——它不会清除自己，只影响后续标准流元素 - 用
.clearfix类时，必须包含*zoom: 1，否则IE6/7的:before/:after伪元素可能压根不生成
display:inline修复双倍边距，但必须配合hasLayout才稳定
display: inline能绕过IE6的双倍边距bug，是因为它让IE6切换到inline元素的边距计算逻辑。但它不是万能胶——单独加这句，常因父容器没hasLayout而失效。
-
*display: inline比display: inline更干净，只有IE6/7读取，其他浏览器无视 - 必须和
float共存，且display: inline声明要写在float之后，否则IE6可能跳过 - 父容器若没触发
hasLayout（比如没zoom: 1），子元素即使加了*display: inline，边距仍可能加倍 - 别用
_display: inline——IE7标准模式下也可能误触发，造成意外样式偏移
用overflow:hidden清除浮动，但得防裁剪和滚动条
overflow: hidden是最快捷的清除浮动方式，它会强制父容器重新包裹浮动子元素。但在IE6/7里，它有个硬伤：如果子元素超出容器（比如下拉菜单、弹窗、绝对定位偏移），会被直接裁掉。
- IE6/7下
overflow: hidden必须配合zoom: 1才能稳定触发hasLayout，否则可能照样塌陷 - 若内容确有溢出需求，宁可用经典
clearfix，也不要依赖overflow: hidden - 测试时注意IE6模拟器常误报滚动条——真IE6下
overflow: hidden一般不会触发滚动条，但overflow: auto会
zoom: 1加了十年没人动过，连当初为什么加都查不到注释；有些clear: both卡在错误的DOM位置，调试半天才发现是上游浮动节点被JS动态删掉了。前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
