diff --git a/templates/zephyr/markdown_help.html b/templates/zephyr/markdown_help.html
index 2dc2242d06..7adc6af72f 100644
--- a/templates/zephyr/markdown_help.html
+++ b/templates/zephyr/markdown_help.html
@@ -46,30 +46,26 @@
           <td>Some inline <code>code</code></td>
         </tr>
         <tr>
-          <td>~~~<br />
-            def bah():<br/>
-            &nbsp;&nbsp;&nbsp;&nbsp;print "Humbug"<br/>
-            ~~~<br/>
-          </td>
+          <td class="preserve_spaces">~~~
+def bah():
+    print "Humbug"
+~~~</td>
           <td><pre>def bah():
     print "Humbug"</pre></td>
         </tr>
         <tr>
-          <td>~~~ .py<br />
-            def bah():<br/>
-            &nbsp;&nbsp;&nbsp;&nbsp;print "Humbug"<br/>
-            ~~~<br/>
-          </td>
+          <td class="preserve_spaces">~~~ .py
+def bah():
+    print "Humbug"
+~~~</td>
           <td>
             <div class="codehilite"><pre><span class="k">def</span> <span class="nf">bah</span><span class="p">():</span>
     <span class="k">print</span> <span class="s">"Humbug"</span></pre></div>
           </td>
         </tr>
-        <tr>
-          <td colspan="2">(Indenting each line four spaces also creates a code block.)</td>
-        </tr>
         </tbody>
       </table>
+      <p>You can also make a code block by indenting each line with 4 spaces.</p>
     </div>
   </div>
   <div class="modal-footer">
diff --git a/zephyr/static/styles/zephyr.css b/zephyr/static/styles/zephyr.css
index 2d59c0edf4..1ebaec3509 100644
--- a/zephyr/static/styles/zephyr.css
+++ b/zephyr/static/styles/zephyr.css
@@ -27,6 +27,10 @@ a:hover code {
     border-color: #005580;
 }
 
+.preserve_spaces {
+    white-space: pre-wrap;
+}
+
 .sidebar-nav {
     background-color: white;
     padding: 0.5em;