Container padding uses per-breakpoint gutter sizes, fixes #19304.

diff --git a/scss/mixins/_grid.scss b/scss/mixins/_grid.scss
index 88cbd249a08065672498b566ec2d3594588c1c92..402a99e928c098ffe7b5c1b6594420cc5092a132 100644 (file)
--- a/scss/mixins/_grid.scss
+++ b/scss/mixins/_grid.scss
@@ -2,14 +2,20 @@
 //
 // Generate semantic grid columns with these mixins.
 
-@mixin make-container($gutter: $grid-gutter-width-base) {
+@mixin make-container($gutters: $grid-gutter-widths) {
   margin-left: auto;
   margin-right: auto;
-  padding-left:  ($gutter / 2);
-  padding-right: ($gutter / 2);
   @if not $enable-flex {
     @include clearfix();
   }
+
+  @each $breakpoint in map-keys($gutters) {
+    @include media-breakpoint-up($breakpoint) {
+      $gutter: map-get($gutters, $breakpoint);
+      padding-right: ($gutter / 2);
+      padding-left:  ($gutter / 2);
+    }
+  }
 }