tweaks to help-block contents

wagtail/contrib/wagtailstyleguide/templates/wagtailstyleguide/base.html

@@ -96,12 +96,13 @@
             <p>Help text is not to be confused with the messages that appear in a banner drop down from the top of the screen. Help text are permanent instructions, visible on every page view, that explain or warn about something.
 
             <div class="help-block help-info">
-                This is help text that might be just for information, explaining what happens next, or drawing the user's attention to something they're about to do
+                <p>This is help text that might be just for information, explaining what happens next, or drawing the user's attention to something they're about to do</p>
+                <p>It could be multiple lines</p>
             </div>
 
-            <div class="help-block help-warning">
+            <p class="help-block help-warning">
                 A warning message might be output in cases where a user's action could have serious consequences
-            </div>
+            </p>
 
             <div class="help-block help-critical">
                 A critical message would probably be rare, in cases where a particularly brittle or dangerously destructive action could be performed and needs to be warned about.

wagtail/wagtailadmin/static/wagtailadmin/scss/components/typography.scss

@@ -58,6 +58,14 @@ kbd{
 .help-block{
     padding:1em;
     margin:1em 0;
+
+    p{
+        margin-top:0;
+
+        &:last-child{
+            margin-bottom:0;
+        }
+    }
 }
     .help-info, .help-warning, .help-critical{
         @include border-radius(3px);