diff --git a/docs/components/navbar.md b/docs/components/navbar.md
index 5fa6a1fd5c..57e0bad7a1 100644
--- a/docs/components/navbar.md
+++ b/docs/components/navbar.md
@@ -57,7 +57,7 @@ Here's an example of all the sub-components included in a responsive light-theme
         <a class="nav-link disabled" href="#">Disabled</a>
       </li>
     </ul>
-    <form class="form-inline mt-2 mt-md-0">
+    <form class="form-inline my-2 my-lg-0">
       <input class="form-control mr-sm-2" type="text" placeholder="Search">
       <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
     </form>
@@ -449,7 +449,7 @@ With no `.navbar-brand` shown in lowest breakpoint:
         <a class="nav-link disabled" href="#">Disabled</a>
       </li>
     </ul>
-    <form class="form-inline mt-2 mt-md-0">
+    <form class="form-inline my-2 my-lg-0">
       <input class="form-control mr-sm-2" type="text" placeholder="Search">
       <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
     </form>
@@ -478,7 +478,7 @@ With a brand name shown on the left and toggler on the right:
         <a class="nav-link disabled" href="#">Disabled</a>
       </li>
     </ul>
-    <form class="form-inline mt-2 mt-md-0">
+    <form class="form-inline my-2 my-lg-0">
       <input class="form-control mr-sm-2" type="text" placeholder="Search">
       <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
     </form>
diff --git a/docs/examples/navbars/index.html b/docs/examples/navbars/index.html
index 7b624fbe5e..f56a85d881 100644
--- a/docs/examples/navbars/index.html
+++ b/docs/examples/navbars/index.html
@@ -46,7 +46,7 @@
             </div>
           </li>
         </ul>
-        <form class="form-inline mt-2 mt-md-0">
+        <form class="form-inline my-2 my-lg-0">
           <input class="form-control mr-sm-2" type="text" placeholder="Search">
           <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
         </form>
@@ -80,7 +80,7 @@
               </div>
             </li>
           </ul>
-          <form class="form-inline mt-2 mt-md-0">
+          <form class="form-inline my-2 my-lg-0">
             <input class="form-control mr-sm-2" type="text" placeholder="Search">
             <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
           </form>
@@ -143,7 +143,7 @@
               </div>
             </li>
           </ul>
-          <form class="form-inline mt-2 mt-md-0">
+          <form class="form-inline my-2 my-lg-0">
             <input class="form-control mr-sm-2" type="text" placeholder="Search">
             <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
           </form>