IE11 完全支持 float，问题多源于清除浮动或父容器塌陷写法错误；clear 必须作用于标准流中紧跟浮动元素后的块级元素，伪元素 clearfix 无需 *zoom:1；三栏布局中间栏掉行需触发 BFC（如 overflow:hidden）。
IE11 本身完全支持 float，不需要额外兼容处理——问题通常出在「清除浮动」或「父容器塌陷」的写法上，而不是 float 本身失效。
为什么加了 clear: both 在 IE11 里还是塌陷
因为 clear 只对标准流中的块级元素生效，而很多开发者把它直接写在父容器上（语法合法但逻辑无效），或者写在浮动子元素自身上（浮动元素无视 clear）。
- 错误写法：
.parent { clear: both; }—— 父元素不是浮动元素的兄弟，clear对它无意义 - 错误写法：
.child { float: left; clear: both; }—— 浮动元素不响应clear - 正确位置：必须是一个紧跟在所有浮动子元素之后、处于标准流中的块级元素，比如
<div style="clear: both"></div> - 更稳妥的做法是用
::after伪元素，且确保content: ""存在（缺了就完全不渲染）
clearfix 类在 IE11 中要不要加 *zoom: 1
不用。IE11 已彻底弃用 hasLayout 机制，*zoom: 1 是专为 IE6/7 设计的 hack，加了既无作用，还可能干扰 CSS 预处理器或 Lint 工具。
- IE11 支持
::after和display: table，经典两行 clearfix 就够：.clearfix::after { content: ""; display: table; clear: both; } - 不必再写
.clearfix::before，IE11 下单伪元素已足够稳定 - 如果项目还需兼容 IE9–IE10，可保留
display: table（比display: block更可靠），但无需*zoom
浮动三栏布局在 IE11 中中间栏掉到下一行
根本原因是中间栏未触发 BFC，无法感知左右浮动栏的存在，于是按普通文档流从新行开始渲染。
立即学习“前端免费学习笔记（深入）”；
- 给中间栏加
overflow: hidden或overflow: auto—— 这是最轻量、最兼容的触发方式，IE11 完全支持 - 避免用
width: calc(100% - 200px - 200px)：IE11 对calc()在 width 中的支持虽存在，但若父容器宽度未定（如width: auto），计算结果可能为auto，导致失效 - 更稳方案：左右栏固定宽（
200px），中间栏用width: auto+overflow: hidden，由 BFC 自动包裹剩余空间 - 慎用
display: inline-block模拟三栏：IE11 中 font-size / white-space 导致的间隙难以控制，反而更难调试
真正容易被忽略的是：IE11 的浮动渲染和现代浏览器几乎一致，但开发者常把其他问题（如盒模型、margin 折叠、HTML 空格解析）误判为「IE11 兼容性问题」。先确认是否真由 float 引起，再动手改清除逻辑——否则越修越乱。
