From e76fce5852b734ca6f0c093b65f29891df3c0ad0 Mon Sep 17 00:00:00 2001
From: Jonathan Hawkins <jchawkins725@gmail.com>
Date: Fri, 21 Jun 2019 04:47:24 +0300
Subject: [PATCH] Combine duplicate documentation examples into one to fix the
 confusing text.

---
 site/docs/4.3/layout/grid.md | 33 +++++++++------------------------
 1 file changed, 9 insertions(+), 24 deletions(-)

diff --git a/site/docs/4.3/layout/grid.md b/site/docs/4.3/layout/grid.md
index 4cad4ac3bd..8aa560c46c 100644
--- a/site/docs/4.3/layout/grid.md
+++ b/site/docs/4.3/layout/grid.md
@@ -151,17 +151,21 @@ For example, here are two grid layouts that apply to every device and viewport,
 {% include example.html content=example %}
 </div>
 
-Equal-width columns can be broken into multiple lines, but there was a [Safari flexbox bug](https://github.com/philipwalton/flexbugs#flexbug-11) that prevented this from working without an explicit `flex-basis` or `border`. There are workarounds for older browser versions, but they shouldn't be necessary if you're up-to-date.
+### Equal-width multi-line
+
+Create equal-width columns that span multiple lines by inserting a `.w-100` where you want the columns to break to a new line. Make the breaks responsive by mixing the `.w-100` with some [responsive display utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/display/).
+
+There was a [Safari flexbox bug](https://github.com/philipwalton/flexbugs#flexbug-11) that prevented this from working without an explicit `flex-basis` or `border`. There are workarounds for older browser versions, but they shouldn't be necessary if you're up-to-date.
 
 <div class="bd-example-row">
 {% capture example %}
 <div class="container">
   <div class="row">
-    <div class="col">Column</div>
-    <div class="col">Column</div>
+    <div class="col">col</div>
+    <div class="col">col</div>
     <div class="w-100"></div>
-    <div class="col">Column</div>
-    <div class="col">Column</div>
+    <div class="col">col</div>
+    <div class="col">col</div>
   </div>
 </div>
 {% endcapture %}
@@ -236,25 +240,6 @@ Use `col-{breakpoint}-auto` classes to size columns based on the natural width o
 {% include example.html content=example %}
 </div>
 
-### Equal-width multi-row
-
-Create equal-width columns that span multiple rows by inserting a `.w-100` where you want the columns to break to a new line. Make the breaks responsive by mixing the `.w-100` with some [responsive display utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/display/).
-
-<div class="bd-example-row">
-{% capture example %}
-<div class="container">
-  <div class="row">
-    <div class="col">col</div>
-    <div class="col">col</div>
-    <div class="w-100"></div>
-    <div class="col">col</div>
-    <div class="col">col</div>
-  </div>
-</div>
-{% endcapture %}
-{% include example.html content=example %}
-</div>
-
 ## Responsive classes
 
 Bootstrap's grid includes five tiers of predefined classes for building complex responsive layouts. Customize the size of your columns on extra small, small, medium, large, or extra large devices however you see fit.