table-layout: fixed没生效的根本原因是缺少三要素：table未设显式width、未通过<colgroup>或第一行单元格定义列宽、混用min-width/max-width干扰宽度计算；必须三者齐备才能真正启用固定布局。
table-layout: fixed 为什么没生效
根本不是属性写错了，而是它被浏览器悄悄忽略了。只要漏掉下面任意一条，table-layout: fixed 就会降级回 auto，列宽继续被内容撑开：
-
<table>没设明确的width（比如width: 100%或width: 800px），没有参照基准，fixed 就无从计算 - 列宽定义没落在第一行的
<th>/<td>上，或没用<colgroup><col>——fixed只读第一行，后面写的width全被无视 - 在单元格上混用了
min-width或max-width，尤其 Firefox 中它们会强行覆盖百分比宽度，优先级比width还高
colgroup 是最稳的列宽定义方式
比起给第一行 <th> 写 style="width: 30%"，<colgroup> 几乎不会翻车：
- 不依赖 DOM 渲染顺序，哪怕
<col>放在<tbody>后面也生效 - 不受
colspan干扰，合并单元格时列宽依然准确 - Android WebView 和旧版 Safari 对
<col>的支持比内联width更一致 - 避免像素和百分比混用（比如一列
120px、一列30%），否则整表可能回退到auto
示例：
<table style="width: 100%; table-layout: fixed;">
<colgroup>
<col style="width: 60%">
<col style="width: 20%">
<col style="width: 20%">
</colgroup>
<thead>
<tr><th>标题</th><th>状态</th><th>操作</th></tr>
</thead>
</table>
text-overflow: ellipsis 在 td 上不生效怎么办
不是 CSS 写错，是前提条件没凑齐。这三样必须同时存在，缺一不可：
立即学习“前端免费学习笔记（深入）”；
-
table设置了table-layout: fixed和显式width - 列宽由
<col>或第一行单元格定义（推荐<col>） -
<td>上加white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
常见陷阱：
- 父容器（比如外层
<div class="table-wrapper">）没设overflow-x: auto，导致横向滚动条出不来 -
<td>被套在display: inline-table里，破坏表格渲染流 - 对中文长串或 URL 直接用
white-space: nowrap，反而造成整行横向溢出，此时该换word-break: break-word+max-width
第一行有 colspan 时列宽失效怎么修
原因很直接：table-layout: fixed 只认第一行，而 colspan 让这一行“缺列”，浏览器就按剩余列数均分宽度，后续行的 width 全无效。
可靠解法只有两个：
- 用
<colgroup><col>定义所有列宽（推荐，干净且兼容） - 加一行隐藏的基准行，放在
<thead>前或<tbody>前，display: none或height: 0都行，但必须保证它是视觉上第一行且不含colspan
不推荐用 visibility: hidden，某些老浏览器仍会参与布局计算；display: none 是更稳妥的选择。
