fixes #22111

- add .col-*-auto to the extend in our grid framework mixins so it gets padding
- this means we can avoid the col-12 classes in our docs for the responsive variants

diff --git a/docs/layout/grid.md b/docs/layout/grid.md
index 01fbfe49384b2550e78721bcc27f2aa766288277..7a16c52a72f03a6169c5e74229dee7c12f0fae11 100644 (file)
--- a/docs/layout/grid.md
+++ b/docs/layout/grid.md
@@ -224,7 +224,7 @@ Use `col-{breakpoint}-auto` classes to size columns based on the natural width o
     <div class="col col-lg-2">
       1 of 3
     </div>
-    <div class="col-12 col-md-auto">
+    <div class="col-md-auto">
       Variable width content
     </div>
     <div class="col col-lg-2">
@@ -235,7 +235,7 @@ Use `col-{breakpoint}-auto` classes to size columns based on the natural width o
     <div class="col">
       1 of 3
     </div>
-    <div class="col-12 col-md-auto">
+    <div class="col-md-auto">
       Variable width content
     </div>
     <div class="col col-lg-2">

diff --git a/scss/mixins/_grid-framework.scss b/scss/mixins/_grid-framework.scss
index 0aa814ab2d89a95166b367db58eaca0968bb5bcf..5459a86f48357ff8fdbf03a2b9f0b8c576f5fab7 100644 (file)
--- a/scss/mixins/_grid-framework.scss
+++ b/scss/mixins/_grid-framework.scss
@@ -22,7 +22,8 @@
         @extend %grid-column;
       }
     }
-    .col#{$infix} {
+    .col#{$infix},
+    .col#{$infix}-auto {
       @extend %grid-column;
     }