diff --git a/docs/layout/media.md b/docs/layout/media.md
index a1fbe827d71801313e6930d99f8f972a3dc25012..79eac78655bcfe71631f97b297a149ca5e308bcd 100644
--- a/docs/layout/media.md
+++ b/docs/layout/media.md
@@ -155,15 +155,15 @@ With a bit of extra markup, you can use media inside list (useful for comment th
     </div>
   </li>
   <li class="media">
+    <div class="media-body">
+      <h4 class="media-heading">Media heading</h4>
+      Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
+    </div>
     <div class="media-right">
       <a href="#">
         <img class="media-object" data-src="holder.js/64x64" alt="Generic placeholder image">
       </a>
     </div>
-    <div class="media-body">
-      <h4 class="media-heading">Media heading</h4>
-      Cras sit amet nibh libero, in gravida nulla. Nulla vel metus scelerisque ante sollicitudin commodo. Cras purus odio, vestibulum in vulputate at, tempus viverra turpis.
-    </div>
   </li>
 </ul>
 {% endexample %}