.wp-block-table { overflow-x: auto; }
.wp-block-table table { min-width: 640px; table-layout: fixed; }

在手机上改一篇带五列表格的草稿,编辑区横向撑出屏幕,右侧两列完全点不到,同一篇发布后前台却能正常横向滚动。先别急着动参数,把报错原文和时间点记下来,顺序反了容易白折腾。

原因不复杂,编辑器 iframe 里的表格没有外层滚动容器,宽度按内容撑开,父级又设了 overflow: hidden。前台模板有 table-wrapper,编辑态没加载那层样式。

这次卡住的地方就在「移动端编辑器溢出」这一环,单独把它拎出来验证,别和其他改动混在同一次发布里。改动写完就同步给同事,下一个人踩同一个坑,成本还是你的。

验证用真实数据走一遍,测试数据太干净,边界情况根本碰不到。能分两步做的操作就别合成一步,中间看一眼返回值,出问题好判断。

处理上按这个顺序:给编辑区加一层 overflow-x: auto 的容器;表格设 table-layout: fixed 并允许单元格换行;移动端编辑长表格改成先保存再在桌面端调;用真机而不是模拟器确认能横向拖动。

改完只确认一件事:手机上表格可以左右拖动,最右一列能点到并编辑。

作者 9823189