.container-fluid默认无左右padding，所谓“白边”实为父元素（如body或CMS wrapper）的padding/margin、主题CSS覆盖或误用.container所致；应通过开发者工具Computed面板定位真实来源，而非盲目加px-0或!important。
container-fluid 为什么加了类还是有左右边距
它默认确实没左右 padding，但“看起来有边距”几乎总是因为外部干扰，不是它的问题。常见真实来源包括：
• <body> 或 CMS 外层 wrapper 上的 padding / margin
• 主题或定制 CSS 显式覆盖了 .container-fluid，比如加了 px-3 类或等效规则
• DevTools 里看到的 padding-inline-start: 15px 是某处自定义样式写的，不是 Bootstrap 原生行为
• 你误把 .container 当成 .container-fluid 在用，而前者在 sm+ 断点下固定带 15px 左右内边距
怎么确认是不是 container-fluid 自己的问题
打开浏览器开发者工具，选中那个元素，直接看 Computed 面板里的 padding-left 和 padding-right 值，并点击右侧对应属性名，看是哪条 CSS 规则生效的：
• 如果来源是 Bootstrap 官方 CSS，且值为 0，说明它本身没问题
• 如果来源是项目里某个 custom.css 或主题文件，就得去查那行覆盖代码
• 如果来源是 body 或父级 div，那就该修父元素，而不是给 .container-fluid 加 p-0 或 !important
为什么加了 p-0 或 px-0 还是没用
p-0 会清上下左右全部内边距，但很多场景其实只需要动左右；px-0 确实只清左右，但它只对当前元素生效——如果父容器本身就有 padding，子元素再怎么清也盖不住。
• 别在 .container-fluid 上盲目加 px-0，先确认它是不是真有 padding
• 更常见的问题是：你写了 px-0，但父级 <main> 或 <section> 自带 px-4，视觉上还是“有边距”
• !important 不要轻易用，它会让后续响应式类（比如 px-md-3）失效，调试时反而更难定位
真正需要全贴边时该怎么做
想让某块内容（比如 banner、Canvas、第三方 embed）严格从左视口边缘到右视口边缘，最稳的做法不是跟 .container-fluid 较劲，而是结构上绕开它：
• 直接用语义化标签如 <header class="hero">，自己设 width: 100vw 和 margin: 0
• 把 <div class="row"> 放进这个 wrapper 里，利用 .row 的负外边距天然抵消列间隙
• 需要栅格？用 .row.g-0 清除列间 gap，比清容器 padding 更精准
• 记住：.container-fluid 的语义就是“无宽度限制、贴边”，一旦它表现异常，问题一定在它外面
