redo the form examples to enable better responsive layout

1 files changed, 17 insertions, 22 deletions

diff --git a/docs/assets/css/docs.css b/docs/assets/css/docs.css
index d0a5623f4..6cb8720c7 100644
--- a/docs/assets/css/docs.css
+++ b/docs/assets/css/docs.css
@@ -146,8 +146,6 @@ section {
      -moz-border-radius: 4px;
           border-radius: 4px;  
 }
-.subhead .nav {
-}
 .subhead .nav a {
   margin: 0;
   padding-top: 11px;
@@ -477,7 +475,7 @@ h2 + .row {
 
 /* Remove bottom margin on example forms in wells */
 form.well {
-  margin-bottom: 0;
+  padding: 14px;
 }
 
 /* Tighten up spacing */
@@ -558,6 +556,14 @@ form.well {
     margin-top: 18px;
   }
 
+  /* Subnav */
+  .subnav {
+    background: none;
+  }
+  .subnav .nav > li {
+    float: none;
+  }
+
   /* Adjust the jumbotron */
   .jumbotron h1,
   .jumbotron p {
@@ -580,25 +586,6 @@ form.well {
     margin: 0 auto 10px;
   }
 
-  /* Subnav */
-  .subhead .nav {
-    padding: 0;
-    background: none;
-  }
-  .subhead .nav > li {
-    float: none;
-  }
-  .subhead .nav li + li a {
-    border-top: 1px solid #eee;
-  }
-  .subhead .subnav-fixed {
-    position: static;
-    top: auto;
-    z-index: auto;
-    width: auto;
-  }
-
-
   /* Don't space out quick links so much */
   .quick-links {
     margin: 40px 0 0;
@@ -632,6 +619,14 @@ form.well {
 
 @media (max-width: 768px) {
 
+  /* Subnav */
+  .subnav-fixed {
+    position: static;
+    top: auto;
+    z-index: auto;
+    width: auto;
+  }
+
   /* Adjust the jumbotron */
   .jumbotron .benefits {
     position: relative;