IE兼容模式下标签内容换行错位，主因是父容器white-space与word-wrap叠加导致意外断行，应加white-space: nowrap;或改用pre-wrap+overflow-x: auto;并显式声明monospace字体及line-height避免渲染异常。
IE兼容模式下标签内容换行错位
IE（尤其是IE8–IE10）在兼容模式（如文档模式为IE7/IE8标准或Quirks）下，标签默认是inline元素，但会继承父容器的white-space行为；若父容器设了word-wrap: break-word或overflow-wrap: break-word，而<code>又没显式重置white-space，内容就可能在不该断行的位置硬折，导致视觉错位、代码块被截断或挤出容器。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 给
标签加white-space: nowrap;避免意外换行 - 若需支持长代码换行，改用
<code>嵌套结构，并设<pre class="brush:php;toolbar:false;">为white-space: pre-wrap; overflow-x: auto;
- 禁用父级对
的继承干扰：在CSS中写code { white-space: pre; font-family: monospace; } - 检查是否误用了
包裹大段多行文本——它本意是标记“一段内联代码”，不是代码块容器
IE中标签字体渲染模糊或高度异常
IE8–IE10对monospace字体回退逻辑不一致：若系统未安装Consolas或Courier New，可能 fallback 到等宽但行高失控的字体（如MS Gothic），造成基线偏移、上下留白过大，看起来像“悬浮”或“下沉”。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 显式声明font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
- 强制line-height: 1.3;（IE中默认line-height计算易受font-size影响）
- 避免在
上设height或min-height——IE会与line-height冲突，引发盒模型错乱 - 若用在表格单元格里，加vertical-align: middle;防止IE默认baseline对齐导致错位
IE条件注释未生效导致样式丢失
当项目用
