diff --git a/app/templates/views/broadcast/preview-message.html b/app/templates/views/broadcast/preview-message.html
index fd8f51f65..a974acc49 100644
--- a/app/templates/views/broadcast/preview-message.html
+++ b/app/templates/views/broadcast/preview-message.html
@@ -14,19 +14,17 @@
 
   {{ page_header("Preview", back_link=url_for('.preview_broadcast_areas', service_id=current_service.id, broadcast_message_id=broadcast_message.id)) }}
 
-  {% for area in broadcast_message.areas %}
-    {% if loop.first %}
-      <ul class="area-list">
-    {% endif %}
+  {{ broadcast_message.template|string }}
+
+  <div class="govuk-!-margin-bottom-3">
+    <ul class="area-list">
+      {% for area in broadcast_message.areas %}
         <li class="area-list-item area-list-item--unremoveable">
           {{ area.name }}
         </li>
-    {% if loop.last %}
-      </ul>
-    {% endif %}
-  {% endfor %}
-
-  {{ broadcast_message.template|string }}
+      {% endfor %}
+    </ul>
+  </div>
 
   {% call form_wrapper() %}
     {{ page_footer('Submit for approval') }}
diff --git a/app/templates/views/broadcast/view-message.html b/app/templates/views/broadcast/view-message.html
index b474da754..a191f0585 100644
--- a/app/templates/views/broadcast/view-message.html
+++ b/app/templates/views/broadcast/view-message.html
@@ -126,9 +126,11 @@
     </p>
   {% endif %}
 
+  {{ broadcast_message.template|string }}
+
   {% for area in broadcast_message.areas %}
     {% if loop.first %}
-      <ul class="area-list govuk-!-margin-bottom-4">
+      <ul class="area-list">
     {% endif %}
         <li class="area-list-item area-list-item--unremoveable">
           {{ area.name }}
@@ -145,6 +147,4 @@
     }) }}
   </div>
 
-  {{ broadcast_message.template|string }}
-
 {% endblock %}