table-layout: fixed 列宽不一致的根本原因不是 bug，而是浏览器在 auto 模式下对换行判定逻辑不同；其生效必须同时满足：table 有明确 width、列宽定义在第一行或 colgroup 中、且不混用 min/max-width。
table-layout: fixed 为什么在 Chrome/Firefox/Safari 中列宽不一致
根本原因不是 bug，而是 table-layout: auto 模式下浏览器各自实现「逐行扫描+换行判定」逻辑不同——Safari 把“测试文本”算成 2 行，Chrome 算成 1 行，导致列宽偏差常达 30px+。table-layout: fixed 能规避这点，但前提是它真被启用；一旦漏掉任一必要条件，浏览器就悄悄回退到 auto，列宽差异照旧。
必须同时满足的三个生效条件
table-layout: fixed 不是开关，而是一组协同规则。漏掉任意一条，它就失效：
-
table元素必须有明确的width（如width: 100%或width: 800px），否则无参照基准，列宽仍由内容驱动 - 列宽定义必须落在第一行的
<th>/<code><td> 上，或更稳妥地用 <code><colgroup><col></colgroup>——table-layout: fixed只读第一行，后续行的width全部被忽略 - 不能在
<th>/<code><td> 上混用 <code>min-width或max-width，尤其 Firefox 中它们会覆盖百分比计算，优先级异常高colgroup 是跨浏览器最稳的列宽定义方式
直接给第一行单元格写
style="width: 30%"看似简单，但在 Android WebView 或旧版 Safari 中，若混用像素和百分比（比如一列120px、一列30%），整张表可能降级回auto。用<colgroup></colgroup>则没这问题：标题 状态 操作 <col>的width在所有现代浏览器中都被严格遵循，且不依赖 DOM 渲染顺序，也不受colspan干扰。动态更新内容后列宽不重算怎么办
JS 插入新行、修改单元格文本后，
table-layout: fixed不会自动重读第一行宽度——浏览器认为“第一行已定”，后续内容再变也不影响列宽。这是最容易被忽略的陷阱。- 不要调用不存在的
table.redraw()方法 - 安全做法是手动触发重读：
table.style.width = table.offsetWidth + 'px'，强制浏览器重新取值并应用fixed规则 - 若用 Layui/Element Plus 等框架，
table.reload()后必须紧跟table.resize()（Layui 2.8+）或重建固定列逻辑
列宽控制权不在内容手里，而在你写的那一行
<col>或第一行<th> 里——只要它存在、可读、没被干扰样式覆盖，跨浏览器一致性就有保障。</th> - 不要调用不存在的
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
