table-layout: fixed下列宽由首行或col元素决定，后续单元格width无效，padding被压缩；auto模式下white-space等才生效；border-collapse不消除padding；box-sizing对table-cell无效。
table-layout: fixed 会让 width 和 padding 表现异常
表格单元格的宽高不完全听你写的 width 或 padding——尤其当 table-layout 是 fixed 时。浏览器会优先按第一行（或 col 元素）的声明定列宽，后续单元格的 width、padding、甚至 box-sizing 都可能被“压扁”或忽略。
常见错误现象：td 设了 width: 200px 和 padding: 16px，但实际内容区域窄得离谱；或者左右 padding 明明写了 24px，视觉上却只有一边有空隙。
-
table-layout: fixed下，列宽由第一行td、th或显式<col width="200">决定，后面所有单元格的width声明无效 -
padding仍生效，但会被挤在固定列宽内，导致内容换行或溢出，box-sizing: border-box也救不了 - 想靠
min-width撑开？没用——fixed模式下它不参与列宽计算
用 table-layout: auto 时，white-space 和 word-break 才真正起作用
很多人以为加了 white-space: nowrap 就能阻止表格单元格换行，结果发现没用。其实是因为 auto 模式下，浏览器要先算内容宽度再分配列宽，此时文本折行策略才被纳入考量。
使用场景：表格列宽需随内容自适应，又希望长文本不把列撑爆（比如日志 ID、URL）。
立即学习“前端免费学习笔记（深入）”；
-
table-layout: auto+td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }才能可靠截断 -
word-break: break-all在auto模式下可强制断词，但在fixed下常被列宽压制失效 - 注意：一旦某列内容极长（如无空格超长 token），
auto可能让整表变宽，触发横向滚动——这不是 bug，是它的设计逻辑
border-collapse: collapse 下，padding 不影响单元格间距，但会影响盒模型边界
很多人以为设了 border-collapse: collapse 就等于“去掉间隙”，结果发现 padding 还是让内容离边框很远。其实 collapse 只合并边框，不吞噬 padding——它依然属于单元格盒子内部空间。
容易踩的坑：用 padding 模拟“单元格间距”，却发现相邻单元格的 padding 在视觉上重叠，看起来像间距翻倍。
-
border-collapse: collapse时，border-spacing完全无效，别白设 -
padding值仍决定内容到边框的距离，但它和相邻单元格的padding不叠加，只是各自独立渲染 - 若真要控制“视觉间距”，更稳的方式是给
td设border后用background-clip: padding-box控制背景绘制范围
嵌套表格或 display: table-cell 元素里，box-sizing 失效是常态
给 td 或 div[display=table-cell] 设 box-sizing: border-box，然后加 padding 和 width，发现总宽还是超出预期——这不是你写错了，是规范限制。
CSS 规范明确：表格单元格的尺寸计算不遵循标准盒模型，box-sizing 对 table-cell 无效（包括 td、th 和 display: table-cell 元素）。
- 无论
box-sizing是什么值，padding和border都会额外增加单元格宽度/高度 - 想精确控宽？只能靠
table-layout: fixed+<col>或首行width，再把内容用max-width+overflow约束 - 用
display: grid或flex替代表格布局时，box-sizing才回归正常——但这意味着放弃语义化表格结构
