低分辨率下相同结构部分网页出现内容溢出重叠容器问题咨询

所有服务页基础模板结构一致，仅WYSIWYG替换的内容不同，问题完全出在异常页面的自定义内容中：

• 你在编辑马拉加（Malaga）对应服务页内容时，要么直接复制粘贴了带内联样式的外部内容，要么手动在可视化编辑器中给内容块（文本容器、图片、按钮等）设置了固定像素宽度/边距，没有使用max-width、百分比、rem这类响应式单位，小屏视口宽度小于硬编码的固定值时，内容就会撑破外层容器，和相邻模块发生重叠
• 部分场景下也可能是你插入的长字符串（比如长网址、无空格的长西语文本）没有配置自动换行规则，宽度超过容器后直接溢出

快速修复步骤 #

1. 打开异常页的开发者工具，选中溢出/重叠的内容块，和正常页同位置的内容块对比CSS属性，即可找到多余的硬编码样式
2. 进入该页的WYSIWYG编辑器，切换到源代码视图，删除内容里所有固定宽度、不合理边距相关的style属性即可解决问题

后续规避方案 #

• 录入内容时优先粘贴纯文本，再在编辑器内设置格式，避免带进来外部的多余样式
• 可以给WYSIWYG编辑器增加配置，禁止用户插入固定像素宽度类的内联样式，统一调用全局预设的响应式样式类

内容的提问来源于stack exchange，提问作者Lorraine