margin-inline: auto 对 table 无效，因其 display: table 不属于支持该属性的类型；需改为 inline-table 或 inline-block 并配合 width 设置才能生效。
margin-inline 不能直接让 HTML 表格整体居中，它只对支持逻辑属性的元素生效，而 <table> 默认是块级元素但不响应 <code>margin-inline: auto —— 浏览器目前（截至 2026 年）仍普遍忽略该声明。
为什么 margin-inline: auto 对 <table> 失效
<p>表格元素的盒模型行为特殊：它不继承父容器的 writing-mode 逻辑方向来解析 <code>margin-inline，且多数引擎（Chrome、Firefox、Safari）尚未实现对 <table> 的 <code>margin-inline: auto 水平居中支持。即使你设置了 writing-mode: vertical-rl 或 horizontal-tb，margin-inline: auto 仍不会触发居中计算。
-
margin-inline: auto 只在 display 值为 inline、inline-block、inline-table 或 flex/grid 项目时才可能生效
<table> 默认 <code>display: table，不属于上述任一可自动分配 inline margin 的类型
- 实测中，
table { margin-inline: auto; } 在 DevTools 中显示为“已设置但未应用”（computed value 仍为 0px）
想用逻辑属性居中表格？先改 display 类型
若坚持使用逻辑方向控制（比如适配 RTL 或竖排文本），必须把表格转为能响应 margin-inline 的 display 类型：
- 用
display: inline-table + 父容器 text-align: center（兼容性好，但非纯逻辑属性方案）
- 或用
display: table 改成 display: inline-block，再设 margin-inline: auto —— 这时才真正起作用
- 注意：
display: inline-block 会让表格失去默认的块级流行为，需手动设 width 防止宽度由内容撑开导致居中偏移
示例：
立即学习“前端免费学习笔记（深入）”；
table {
display: inline-block;
margin-inline: auto;
width: 80%;
}
margin-inline: auto 只在 display 值为 inline、inline-block、inline-table 或 flex/grid 项目时才可能生效<table> 默认 <code>display: table，不属于上述任一可自动分配 inline margin 的类型
table { margin-inline: auto; } 在 DevTools 中显示为“已设置但未应用”（computed value 仍为 0px）想用逻辑属性居中表格？先改 display 类型
若坚持使用逻辑方向控制（比如适配 RTL 或竖排文本），必须把表格转为能响应 margin-inline 的 display 类型：
- 用
display: inline-table+ 父容器text-align: center（兼容性好，但非纯逻辑属性方案） - 或用
display: table改成display: inline-block，再设margin-inline: auto—— 这时才真正起作用 - 注意：
display: inline-block会让表格失去默认的块级流行为，需手动设width防止宽度由内容撑开导致居中偏移
示例：
立即学习“前端免费学习笔记（深入）”；
此时父容器无需额外样式，margin-inline: auto 就会按当前 writing-mode 解析为左右或上下外边距，并均分剩余空间。
不同 writing-mode 下的实际表现差异
即使成功应用 margin-inline: auto，效果也取决于父容器的 writing-mode：
-
writing-mode: horizontal-tb（默认）→margin-inline: auto等价于margin-left: auto; margin-right: auto -
writing-mode: vertical-rl→margin-inline: auto会尝试在行内方向（即垂直方向）居中，但<table> 的高度通常不固定，结果往往不可控 <li> <code>writing-mode: vertical-lr同理，且多数浏览器对表格在竖排模式下的尺寸计算存在偏差
换句话说：逻辑 margin 居中对表格来说，只在水平书写模式下稳定可用；一旦进入竖排场景，建议改用 transform: translate(-50%, -50%) + position: absolute 配合 top: 50%; left: 50% 更可靠。
真正容易被忽略的是：表格本身不是“逻辑方向友好型”元素，强行套用 margin-inline 不仅无效，还可能掩盖真实布局问题——比如父容器 width 未定义、或存在 float / flex 干扰。优先用 margin: 0 auto + 固定 width，或 flex 容器包裹，才是更直白有效的路径。
