fix form styles on prepend/append for consistency, update code docs with examples of the code snippets

4 files changed, 14 insertions, 2 deletions

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 675446f62..5330b5102 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -894,7 +894,7 @@ input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, selec
   min-width: 16px;
   height: 18px;
   margin-right: -1px;
-  padding: 4px 4px 4px 5px;
+  padding: 4px 5px;
   font-weight: normal;
   line-height: 18px;
   color: #999999;
diff --git a/docs/base-css.html b/docs/base-css.html
index 0b2c4547e..0406ff229 100644
--- a/docs/base-css.html
+++ b/docs/base-css.html
@@ -372,6 +372,9 @@ For example, <code>section</code> should be wrapped as inline.
     <div class="span4">
       <h2>Basic block</h2>
       <p>Use <code>&lt;pre&gt;</code> for multiple lines of code. Be sure to turn any carets into their unicode characters for proper rendering.</p>
+<pre>
+&lt;p&gt;Sample text here...&lt;/p&gt;
+</pre>
 <pre class="prettyprint linenums" style="margin-bottom: 9px;">
 &lt;pre&gt;
   &amp;lt;p&amp;gt;Sample text here...&amp;lt;/p&amp;gt;
@@ -383,6 +386,9 @@ For example, &lt;code&gt;section&lt;/code&gt; should be wrapped as inline.
       <h2>Google Prettify</h2>
       <p>Take the same <code>&lt;pre&gt;</code> element and add two optional classes for enhanced rendering.</p>
 <pre class="prettyprint linenums" style="margin-bottom: 9px;">
+&lt;p&gt;Sample text here...&lt;/p&gt;
+</pre>
+<pre class="prettyprint linenums" style="margin-bottom: 9px;">
 &lt;pre class="prettyprint
      linenums"&gt;
   &amp;lt;p&amp;gt;Sample text here...&amp;lt;/p&amp;gt;
diff --git a/docs/templates/pages/base-css.mustache b/docs/templates/pages/base-css.mustache
index 2b9a459c8..b47bcf265 100644
--- a/docs/templates/pages/base-css.mustache
+++ b/docs/templates/pages/base-css.mustache
@@ -300,6 +300,9 @@
     <div class="span4">
       <h2>Basic block</h2>
       <p>{{_i}}Use <code>&lt;pre&gt;</code> for multiple lines of code. Be sure to turn any carets into their unicode characters for proper rendering.{{/i}}</p>
+<pre>
+&lt;p&gt;{{_i}}Sample text here...{{/i}}&lt;/p&gt;
+</pre>
 <pre class="prettyprint linenums" style="margin-bottom: 9px;">
 &lt;pre&gt;
   &amp;lt;p&amp;gt;{{_i}}Sample text here...{{/i}}&amp;lt;/p&amp;gt;
@@ -311,6 +314,9 @@
       <h2>Google Prettify</h2>
       <p>Take the same <code>&lt;pre&gt;</code> element and add two optional classes for enhanced rendering.</p>
 <pre class="prettyprint linenums" style="margin-bottom: 9px;">
+&lt;p&gt;{{_i}}Sample text here...{{/i}}&lt;/p&gt;
+</pre>
+<pre class="prettyprint linenums" style="margin-bottom: 9px;">
 &lt;pre class="prettyprint
      linenums"&gt;
   &amp;lt;p&amp;gt;{{_i}}Sample text here...{{/i}}&amp;lt;/p&amp;gt;
diff --git a/less/forms.less b/less/forms.less
index 6b0f5ec52..9d94a64b7 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -417,7 +417,7 @@ select:focus:required:invalid {
     min-width: 16px;
     height: @baseLineHeight;
     margin-right: -1px;
-    padding: 4px 4px 4px 5px;
+    padding: 4px 5px;
     font-weight: normal;
     line-height: @baseLineHeight;
     color: @grayLight;