fixed="left"在firefox中右偏是因滚动条宽度未被扣除导致盒模型计算偏差：firefox测量更保守，不自动从table-layout:auto列宽中减去约16px滚动条宽，使左侧固定列transform或left值偏大，需用getboundingclientrect校准并设style.left=-scrollbarwidth。
fixed="left" 在 Firefox 中错位，基本不是 JS 逻辑问题，而是 CSS 盒模型计算偏差 + 滚动条宽度未对齐导致的视觉偏移。
为什么 fixed="left" 在 Firefox 里会右偏几个像素？
Firefox 对 scrollbar-width 的测量更保守，且不自动将滚动条宽度从 table-layout: auto 的列宽计算中扣除。当 el-table 或 antd Table 渲染固定列时，左侧固定列的 right 偏移或 transform 位移值，常基于父容器总宽减去滚动体宽度得出——但这个“滚动体宽度”在 Firefox 中可能漏减了滚动条（约 16px），导致 fixed 列被画在了内容区右侧之外，肉眼表现为“右偏”。
- 打开 DevTools → Elements → 查看
.el-table__fixed元素的transform值，对比 Chrome/Firefox 是否一致 - 检查
.el-table__body-wrapper的width和clientWidth差值，Firefox 下该差值大概率 ≈ 滚动条宽度 - 若项目用了自定义滚动条（
::-webkit-scrollbar），Firefox 根本不识别，会导致两侧滚动条“厚度”不一致，加剧错位
用 getBoundingClientRect() 强制校准 fixed 列位置
不能依赖框架自动重算，必须在每次 resize 或数据更新后手动触发一次位置同步。关键不是重绘整个表格，而是精准修正 left 固定列的 transform 或 left 值。
- 监听
window.addEventListener('resize', ...)和this.$nextTick(() => {...})（Vue 2）或nextTick(...)（Vue 3） - 获取
.el-table__body-wrapper的getBoundingClientRect().width和.el-table__body的offsetWidth，差值即为滚动条宽度 - 将该差值作为负偏移，设置到
.el-table__fixed的style.left上，例如：elFixed.style.left = (-scrollbarWidth) + 'px' - 避免直接操作
transform：Firefox 对transform: translateX()的 subpixel 渲染更敏感，容易抖动
禁用 table-layout: auto，改用 fixed + 显式列宽
这是最稳定、副作用最小的方案。Firefox 在 table-layout: auto 下对 fixed 列的 width 继承和 overflow 处理不可靠，尤其当列内含 flex 或文字换行时。
- 给
<el-table></el-table>添加:fit="false"（Element Plus）或tableLayout="fixed"（Ant Design Vue） - 所有
<el-table-column></el-table-column>必须声明width（数值或百分比），哪怕写成width="150"或width="20%" - 删掉列上的
min-width或max-width，它们在table-layout: fixed下会被忽略，反而干扰计算 - 如果列宽需响应式，用 CSS 类配合
@media控制width值，而非 JS 动态设 style
别碰 overflow-x: hidden 父容器
很多开发者为了“隐藏横向滚动条”给表格外层加了 overflow-x: hidden，这在 Firefox 中会截断 fixed 列的渲染区域——因为 fixed 列是绝对定位脱离文档流的，其渲染边界受父级 overflow 影响极大。
- 检查表格最外层容器（如
.table-wrapper）是否设置了overflow-x: hidden或contain: layout - 若必须隐藏原生滚动条，请只作用于
.el-table__body-wrapper，并确保其padding-right≥ 滚动条宽度，给 fixed 列留出空间 - Firefox 不支持
scrollbar-width: none，不要尝试用伪元素覆盖；改用::-webkit-scrollbar { display: none }+overflow: overlay（仅 Chrome/Edge）即可，Firefox 保持默认行为反而更稳
真正麻烦的点在于：错位往往只在特定 DPI、特定窗口宽度、特定数据长度下复现，而且 reload 后可能暂时消失——这意味着你得在 resize 回调里做校准，还得防抖，还得兼容 Vue 的响应式更新节奏。别指望一次 CSS 调整就永久解决。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
