Style template length message to sit inline

This looks tidy, and because of the sticky footer it means the message
is always visible, even if your template is quite long. So no matter
where you’re scrolled to in the template you don’t have to scroll to the
bottom to see the count update.

app/assets/stylesheets/components/message.scss

@@ -205,7 +205,7 @@ a {
       margin: 0;
     }
 
-    .content-fixed & {
+    .content-fixed__bottom & {
       right: govuk-spacing(3);
     }
 

app/assets/stylesheets/components/page-footer.scss

@@ -3,6 +3,10 @@
   position: relative;
   margin-bottom: 30px;
 
+  &--inline-block {
+    display: inline-block;
+  }
+
   &-delete-link {
 
     line-height: 40px;

app/assets/stylesheets/views/template.scss

@@ -55,3 +55,15 @@
   top: 51px; // aligns with ‘change postage’ link
   left: 66px; // Aligns to left of logo area
 }
+
+.template-content-count {
+  @include core-19($tabular-numbers: true);
+  color: $secondary-text-colour;
+  vertical-align: bottom;
+  padding: 0 0 govuk-spacing(1) govuk-spacing(2);
+  display: inline-block;
+
+  & .govuk-error-message {
+    margin-top: 0;
+  }
+}