表格单元格内浮动元素不响应text-align，因float使元素脱离文档流，而text-align仅作用于块级容器内的行内内容；正确做法是用text-align和vertical-align控制对齐。
浮动元素本身不响应 text-align
表格单元格（ 常见误操作是想“既让文字居中，又让整个单元格右贴边”，结果给 95% 的表格对齐问题，靠这两个属性就够了： 如果目标是“某几列右对齐数字”，直接写： 立即学习“前端免费学习笔记（深入）”； 注意： 极少数场景（比如在单元格内叠加图标+文字并右对齐），可对单元格**内部元素**浮动，而非单元格自身： 此时 表格单元格不是普通块容器，浮动它等于主动放弃表格语义和默认对齐能力。多数所谓“对齐失败”，其实是没意识到 或 ）里加了 float: left 或 float: right，再设 text-align: center 是无效的。因为 float 会让元素脱离文档流，而 text-align 只作用于**行内内容在块级容器内的对齐**，对已浮动的子元素无控制力。用
text-align 对齐文字，用 float 控制布局？别混用 加 float。这会破坏表格渲染模型——表格单元格本就不该浮动，浏览器可能忽略 float、或导致列宽错乱、甚至塌陷。
float 属于传统文档流脱离方案，和表格的自动对齐/等高/重排机制天然冲突margin-left: auto（配合 display: table-cell 时需注意父级限制）或更现代的 justify-content（但需切换为 display: flex） 上设 text-align: center 或 text-align: right 即可，无需浮动替代方案：用
text-align + vertical-align 覆盖绝大多数需求td {
text-align: right; /* 水平：左/中/右 */
vertical-align: middle; /* 垂直：top/middle/bottom */
}td.number, th.number {
text-align: right;
padding-right: 8px;
}vertical-align 对 本身无效，只对
、 、 生效； text-align 在 上设置会被子元素继承，但最好显式写在
级别，避免意外覆盖。 非要浮动？先确认是否真的需要脱离表格流
★
重要
.icon {
float: right;
margin-left: 4px;
}
.label {
/* 不浮动，自然占据剩余空间 */
}text-align 仍可作用于 内非浮动内容。但要注意清除浮动（如加 overflow: hidden 到 ），否则高度可能塌陷。 text-align 和 vertical-align 的作用域，或者把布局责任错交给浮动。
