1 files changed, 19 insertions, 26 deletions

diff --git a/assets/stylesheets/bootstrap/mixins/_grid.scss b/assets/stylesheets/bootstrap/mixins/_grid.scss
index 88cbd24..9cd8c7b 100644
--- a/assets/stylesheets/bootstrap/mixins/_grid.scss
+++ b/assets/stylesheets/bootstrap/mixins/_grid.scss
@@ -2,13 +2,17 @@
 //
 // Generate semantic grid columns with these mixins.
 
-@mixin make-container($gutter: $grid-gutter-width-base) {
+@mixin make-container($gutters: $grid-gutter-widths) {
+  position: relative;
   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);
+    }
   }
 }
 
@@ -34,12 +38,8 @@
 }
 
 @mixin make-row($gutters: $grid-gutter-widths) {
-  @if $enable-flex {
-    display: flex;
-    flex-wrap: wrap;
-  } @else {
-    @include clearfix();
-  }
+  display: flex;
+  flex-wrap: wrap;
 
   @each $breakpoint in map-keys($gutters) {
     @include media-breakpoint-up($breakpoint) {
@@ -52,14 +52,11 @@
 
 @mixin make-col-ready($gutters: $grid-gutter-widths) {
   position: relative;
-  min-height: 1px; // Prevent collapsing
-
   // Prevent columns from becoming too narrow when at smaller grid tiers by
   // always setting `width: 100%;`. This works because we use `flex` values
   // later on to override this initial width.
-  @if $enable-flex {
-    width: 100%;
-  }
+  width: 100%;
+  min-height: 1px; // Prevent collapsing
 
   @each $breakpoint in map-keys($gutters) {
     @include media-breakpoint-up($breakpoint) {
@@ -71,16 +68,12 @@
 }
 
 @mixin make-col($size, $columns: $grid-columns) {
-  @if $enable-flex {
-    flex: 0 0 percentage($size / $columns);
-    // Add a `max-width` to ensure content within each column does not blow out
-    // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
-    // do not appear to require this.
-    max-width: percentage($size / $columns);
-  } @else {
-    float: left;
-    width: percentage($size / $columns);
-  }
+  flex: 0 0 percentage($size / $columns);
+  // width: percentage($size / $columns);
+  // Add a `max-width` to ensure content within each column does not blow out
+  // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
+  // do not appear to require this.
+  max-width: percentage($size / $columns);
 }
 
 @mixin make-col-offset($size, $columns: $grid-columns) {