表格英文单词不换行的根本原因是默认white-space: nowrap和table-layout: fixed未配单元格宽度；修复须依次设置white-space: normal、overflow-wrap: break-word，并为单元格显式指定width或min-width。
表格里英文单词不换行？先查 white-space 和 table-layout
绝大多数表格单元格文字不换行，根本原因不是没加 word-break，而是 <td> 默认带 <code>white-space: nowrap，且父表用了 table-layout: fixed 却没给单元格设宽度。这两个条件一叠加，overflow-wrap 或 word-break 全部失效。
修复顺序必须严格：
- 给 <td> 加 <code>white-space: normal（不是 pre 或 nowrap）
- 加 overflow-wrap: break-word（别用已废弃的 word-break: break-word）
- 如果父 <table> 有 <code>table-layout: fixed，必须给该 <td> 显式设 <code>width 或 min-width，否则样式被锁死
word-break: break-all 在表格中为什么有时还撑开？
写上 word-break: break-all 却依然横向溢出，常见于两种情况：
- 单元格是
display: flex或display: grid的子项 → 子项默认min-width: auto，得额外加min-width: 0 - 单元格内容是
<a></a>、<span></span>这类 inline 元素 → 它们不响应块级换行规则，需加display: inline-block或display: block - 父表用了
table-layout: fixed，但没给该<td> 设 <code>width→ 浏览器按内容算宽，break-all根本没机会触发中英混排表格该用
overflow-wrap还是word-break？纯中文表格用
word-break: break-all看似能断字，但夹着英文长串（如 “订单号：ORD123456789abc”）时，中文正常断，英文整段溢出——因为浏览器认为中文已有断点，不会启动兜底逻辑。正确组合是：
overflow-wrap: break-word+word-break: keep-all：-
overflow-wrap: break-word负责“要不要断”（仅当整词放不下时才触发） -
word-break: keep-all负责“在哪能断”（中文不断字，英文也不拆词，把断点决策权交给overflow-wrap） - 两者必须配
max-width或width才生效，没宽度等于没写
移动端和旧版 Safari 表格里的兼容陷阱
word-break: break-all在 iOS 12 以下 WebView 中对<td> 支持不稳定；Safari 15.4 之前，在 <code>contenteditable或<textarea></textarea>内也常失效。更稳妥的做法是：- 优先用
overflow-wrap: break-word（兼容性比word-break: break-all更好） - 避免在
<td> 上直接写 <code>word-break: break-word（它已被 Chrome 89+ 彻底移除） - 若必须强制切分（如日志 ID 列表），改用
<wbr></wbr>在 URL 斜杠、连字符等自然断点手动插入换行机会
真正容易被忽略的是：所有换行行为都依赖容器有明确宽度约束，没有
width、max-width或弹性布局下的有效收缩机制，浏览器连“是否溢出”都检测不到，后面所有属性都是空谈。 -
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
