From 538f4f10c9cd5cd3803f43dc0ccc2d8c6cdb6e7b Mon Sep 17 00:00:00 2001
From: Martijn Cuppens <martijn.cuppens@gmail.com>
Date: Wed, 25 Dec 2019 21:16:58 +0100
Subject: [PATCH] Allow percentages in container widths (#29819)

---
 scss/_grid.scss | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/scss/_grid.scss b/scss/_grid.scss
index d36ee75d8874..57ec5a9d0b94 100644
--- a/scss/_grid.scss
+++ b/scss/_grid.scss
@@ -25,11 +25,19 @@
         max-width: $container-max-width;
       }
 
+      // Extend each breakpoint which is smaller or equal to the current breakpoint
+      $extend-breakpoint: true;
+
       @each $name, $width in $grid-breakpoints {
-        @if ($container-max-width > $width or $breakpoint == $name) {
+        @if ($extend-breakpoint) {
           .container#{breakpoint-infix($name, $grid-breakpoints)} {
             @extend %responsive-container-#{$breakpoint};
           }
+
+          // Once the current breakpoint is reached, stop extending
+          @if ($breakpoint == $name) {
+            $extend-breakpoint: false;
+          }
         }
       }
     }