offset类必须加在col-*元素上而非.row或普通div；需带正确断点前缀（如offset-md-3），且列宽+偏移≤12，否则换行；父.row不可缺失或被修改flex属性，否则margin-left计算失效。
offset类必须加在col-*元素上，不是.row或普通div
直接给<div class="row">加offset-md-3完全无效——这个类只对带col-*的元素生效，底层靠margin-left: calc()实现，而计算依赖列宽定义和父.row的栅格上下文。常见错误写法：<div class="row offset-md-3"><div class="col-md-6">内容</div></div>；正确写法：<div class="row"><div class="col-md-6 offset-md-3">内容</div></div>。如果目标元素没加col-md-6这类类（比如只是个<div>），哪怕写了offset-md-4，浏览器也会忽略。
断点前缀不匹配或缺失，导致样式未定义
Bootstrap 4 要求offset类必须带断点前缀，offset-3或col-md-offset-3都不合法：offset-3无对应 CSS 规则；col-md-offset-3是 Bootstrap 3 语法，新版里根本不存在。必须写成offset-md-3、offset-lg-2等，且断点要与列本身一致——col-lg-4就得配offset-lg-2，写offset-md-2在大屏下不会动。小屏（xs）需显式写offset-2（不是offset-xs-2，Bootstrap 4 不支持 xs 前缀的 offset）。
列宽 + 偏移 > 12，触发自动换行
这不是 bug，是栅格系统硬性约束。col-md-8 offset-md-5 → 8 + 5 = 13 > 12 → 整列掉到下一行。居中一个col-md-8，得用offset-md-2（8 + 2 = 10 ≤ 12）。同一行多个列都加 offset 时，不要简单相加：第二列的offset-md-2是从第一列结束位置起算，容易重叠或错位。安全做法：只给目标列加 offset，其他列保持原始宽度，且整行所有col-*宽度值与offset-*数值之和 ≤ 12。
父.row被手动修改flex属性，覆盖offset的margin
offset-*本质是加margin-left，但若父.row被设了justify-content: center或flex-wrap: wrap-reverse，这个 margin 就可能被 flex 对齐逻辑覆盖。另外，混用offset-md-3和ms-3也危险：offset是百分比计算（如calc(33.333% + 1.5rem)），ms-3是固定间距（如1rem），两者逻辑冲突，小屏下ms-3仍生效而offset-md-3失效，可能导致列被推出视口。调试时务必打开开发者工具，看 Computed Styles 里margin-left是否为预期值。
立即学习“前端免费学习笔记（深入）”；
实际生效的关键点很细：col 类是否存在、断点是否对齐、父 row 是否干净、computed margin 是否被覆盖——光看 class 名有没有写对，远远不够。
