Question

在VueBootstrap theming guide之后，我正在为BootstrapVue 2.0（使用Bootstrap 4.3）构建主题。我有一个theme.scss文件，该文件的开头有替换项，结尾有基本样式的导入。我正在尝试覆盖默认的容器水平填充，但似乎不起作用。

theme.scss

$container-padding-x: 30px !default;

@import 'bootstrap/scss/bootstrap.scss';
@import 'bootstrap-vue/src/index.scss';

容器左侧和右侧的填充保留为默认的15px。

此外，如果我尝试覆盖装订线宽度，则它可以工作，并且更改甚至可以调整容器填充，因为它的填充量是装订线宽度的一半。

$grid-gutter-width: 60px !default;

为什么变量覆盖有差异？

Answer 1

$container-padding-x在Bootstrap v4.3.x中不是变量（但在尚未发布的v5.x中）

网格填充的控制由$grid-gutter-width控制，该$grid-gutter-width / 2应用于行（$grid-gutter-width / 2的负边距）和列的填充（containers）

$grid-gutter-width / 2也得到{{1}}的x填充