页面右侧出现多余空白，经排查锁定某HTML区块为诱因

先查最容易踩的几个坑： #

• 修复栅格列的笔误：代码里<div class="col-xl-6 col-lg-12 col-m-12 fade-in3">中的col-m-12是错的，Bootstrap的断点后缀是sm/md/lg/xl，改成col-md-12再说——这个笔误会直接导致中等屏幕下栅格布局乱掉，触发横向滚动条。
• 补全Bootstrap布局容器：你的.row直接放在.section2里了，Bootstrap的.row默认带负margin，必须套在.container或.container-fluid里，不然很容易左右溢出。把.section2改成<div class="section2 container-fluid">试试。
• 调整行的内边距：.row加了px-5，小屏幕下这个内边距加上栅格自带的padding，会让内容超出视口。换成响应式内边距：px-lg-5 px-md-3 px-2，根据屏幕尺寸动态调整。

再深入排查自定义样式： #

• 打开DevTools选中.section2，检查它的width/min-width/padding-right/margin-right有没有设成超过100%的值，或者有没有position: absolute导致元素跑出去。
• 看表单里的input/textarea，有没有自定义样式给了固定宽度（比如width: 110%），或者textarea的cols值太大。给.formStyle加width: 100%; max-width: 100%;锁死宽度。
• 检查.iconStyle2、.p-style-s2这些自定义类，有没有离谱的margin-right或者display属性导致布局错位。

快速测试技巧： #

1. 先改col-m-12为col-md-12，刷新看空白没没消失——大概率能解决。
2. 临时给.section2加overflow-x: hidden能遮掉空白，但这是治标，还是要找到根源。
3. 在DevTools里逐个禁用Section2子元素的样式，看哪个样式一禁用，空白就消失。

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