The Bootstrap v4 grid system has five tiers of classes: xs (extra small), sm (small), md (medium), lg (large), and xl (extra large). You can use nearly any combination of these classes to create more dynamic and flexible layouts.
-
Each tier of classes scales up, meaning if you plan on setting the same widths for xs and sm, you only need to specify xs.
+
The Bootstrap v4 grid system has five tiers of classes: xs (extra small, this class infix is not used), sm (small), md (medium), lg (large), and xl (extra large). You can use nearly any combination of these classes to create more dynamic and flexible layouts.
+
Each tier of classes scales up, meaning if you plan on setting the same widths for md, lg and xl, you only need to specify md.
-
.col-12 .col-md-8
+
.col-md-8
.col-6 .col-md-4
@@ -115,7 +115,7 @@ include_js: false
Mixed: mobile, tablet, and desktop
-
.col-12 .col-sm-6 .col-lg-8
+
.col-sm-6 .col-lg-8
.col-6 .col-lg-4
@@ -124,4 +124,4 @@ include_js: false
.col-6 .col-sm-4
-
+
diff --git a/site/content/docs/4.3/layout/grid.md b/site/content/docs/4.3/layout/grid.md
index 75c14088b..df606e222 100644
--- a/site/content/docs/4.3/layout/grid.md
+++ b/site/content/docs/4.3/layout/grid.md
@@ -303,7 +303,7 @@ Don't want your columns to simply stack in some grid tiers? Use a combination of
-
.col-12 .col-md-8
+
.col-md-8
.col-6 .col-md-4
@@ -477,7 +477,7 @@ In practice, here's how it looks. Note you can continue to use this with all oth