diff --git a/app/assets/javascripts/discourse/components/flag-action-type.js.es6 b/app/assets/javascripts/discourse/components/flag-action-type.js.es6
index 0598ffa8e8..7f0ffb70ed 100644
--- a/app/assets/javascripts/discourse/components/flag-action-type.js.es6
+++ b/app/assets/javascripts/discourse/components/flag-action-type.js.es6
@@ -2,6 +2,7 @@ import { MAX_MESSAGE_LENGTH } from 'discourse/models/post-action-type';
 import computed from 'ember-addons/ember-computed-decorators';
 
 export default Ember.Component.extend({
+  classNames: ['flag-action-type'],
 
   @computed('flag.name_key')
   customPlaceholder(nameKey) {
diff --git a/app/assets/javascripts/discourse/templates/components/flag-action-type.hbs b/app/assets/javascripts/discourse/templates/components/flag-action-type.hbs
index 8138a72954..c1ee046348 100644
--- a/app/assets/javascripts/discourse/templates/components/flag-action-type.hbs
+++ b/app/assets/javascripts/discourse/templates/components/flag-action-type.hbs
@@ -1,11 +1,17 @@
 {{#if isNotifyUser}}
   <h3>{{formattedName}}</h3>
   <div class='controls'>
-    <label class='radio'><input type='radio' id="radio_{{unbound flag.name_key}}" {{action "changePostActionType" flag}} name='post_action_type_index'> <span class='description'>{{{flag.description}}}</span></label>
-    {{#if showMessageInput}}
-      {{textarea name="message" class="flag-message" placeholder=customPlaceholder value=message}}
-      <div class="custom-message-length {{customMessageLengthClasses}}">{{customMessageLength}}</div>
-    {{/if}}
+    <label class='radio'>
+      <input type='radio' id="radio_{{unbound flag.name_key}}" {{action "changePostActionType" flag}} name='post_action_type_index'>
+
+      <div class='flag-action-type-details'>
+        <span class='description'>{{{flag.description}}}</span>
+        {{#if showMessageInput}}
+          {{textarea name="message" class="flag-message" placeholder=customPlaceholder value=message}}
+          <div class="custom-message-length {{customMessageLengthClasses}}">{{customMessageLength}}</div>
+        {{/if}}
+      </div>
+    </label>
   </div>
   {{#if staffFlagsAvailable}}
     <hr>
@@ -14,10 +20,13 @@
 {{else}}
   <div class='controls'>
     <label class='radio'>
-      <input type='radio' id="radio_{{unbound flag.name_key}}" {{action "changePostActionType" flag}} name='post_action_type_index'> <strong>{{formattedName}}</strong>
-      {{#if showDescription}}
-        <div class='description'>{{{description}}}</div>
-      {{/if}}
+      <input type='radio' id="radio_{{unbound flag.name_key}}" {{action "changePostActionType" flag}} name='post_action_type_index'>
+      <div class='flag-action-type-details'>
+        <strong>{{formattedName}}</strong>
+        {{#if showDescription}}
+          <div class='description'>{{{description}}}</div>
+        {{/if}}
+      </div>
     </label>
     {{#if showMessageInput}}
       {{textarea name="message" class="flag-message" placeholder=customPlaceholder value=message}}
diff --git a/app/assets/stylesheets/desktop/modal.scss b/app/assets/stylesheets/desktop/modal.scss
index 373921ddab..41c8edf3e4 100644
--- a/app/assets/stylesheets/desktop/modal.scss
+++ b/app/assets/stylesheets/desktop/modal.scss
@@ -92,14 +92,13 @@
 }
 
 .custom-message-length {
-  margin: -10px 0 10px 20px;
   color: dark-light-choose($primary-low-mid, $secondary-high);
   font-size: 85%;
 }
 
 .flag-message {
-  margin-left: 20px;
   width: 95% !important;
+  margin: 0;
 }
 
 .edit-category-modal {