diff --git a/shared/src/components/macro/action-editor/macro-action-editor.component.html b/shared/src/components/macro/action-editor/macro-action-editor.component.html
index 2d9428bc..424b3b9b 100644
--- a/shared/src/components/macro/action-editor/macro-action-editor.component.html
+++ b/shared/src/components/macro/action-editor/macro-action-editor.component.html
@@ -1,6 +1,6 @@
 <div class="action--editor">
     <div class="row">
-        <div class="col-xs-4 editor__tab-links">
+        <div class="col-lg-3 editor__tab-links">
             <ul class="nav nav-pills nav-stacked">
                 <li #macroText [class.active]="activeTab === TabName.Text" (click)="selectTab(TabName.Text)">
                     <a>
@@ -28,7 +28,7 @@
                 </li>
             </ul>
         </div>
-        <div class="col-xs-8 editor__tabs" [ngSwitch]="activeTab">
+        <div class="col-xs-12 col-lg-9 editor__tabs" [ngSwitch]="activeTab">
             <macro-text-tab #tab *ngSwitchCase="TabName.Text" [macroAction]="editableMacroAction"></macro-text-tab>
             <macro-key-tab #tab *ngSwitchCase="TabName.Keypress" [macroAction]="editableMacroAction"></macro-key-tab>
             <macro-mouse-tab #tab *ngSwitchCase="TabName.Mouse" [macroAction]="editableMacroAction"></macro-mouse-tab>
diff --git a/shared/src/components/macro/action-editor/tab/key/macro-key.component.html b/shared/src/components/macro/action-editor/tab/key/macro-key.component.html
index 9437ceb0..522a37f1 100644
--- a/shared/src/components/macro/action-editor/tab/key/macro-key.component.html
+++ b/shared/src/components/macro/action-editor/tab/key/macro-key.component.html
@@ -1,5 +1,5 @@
 <div class="col-xs-12 macro-key__container">
-    <div class="col-xs-4 macro-key__types">
+    <div class="col-xs-3 macro-key__types">
         <ul class="nav nav-pills nav-stacked">
             <li #keyMove [class.active]="activeTab === TabName.Keypress" (click)="selectTab(TabName.Keypress)">
                 <a>
@@ -21,7 +21,7 @@
             </li>
         </ul>
     </div>
-    <div class="col-xs-8 macro-key__action-container">
+    <div class="col-xs-9 macro-key__action-container">
         <div class="macro-key__action">
             <h4 *ngIf="activeTab === TabName.Keypress">Press key</h4>
             <h4 *ngIf="activeTab === TabName.Hold">Hold key</h4>
diff --git a/shared/src/components/macro/action-editor/tab/mouse/macro-mouse.component.html b/shared/src/components/macro/action-editor/tab/mouse/macro-mouse.component.html
index c5568cbd..6419fce3 100644
--- a/shared/src/components/macro/action-editor/tab/mouse/macro-mouse.component.html
+++ b/shared/src/components/macro/action-editor/tab/mouse/macro-mouse.component.html
@@ -1,5 +1,5 @@
 <div class="col-xs-12 macro-mouse__container">
-    <div class="col-xs-4 macro-mouse__types">
+    <div class="col-xs-3 macro-mouse__types">
         <ul class="nav nav-pills nav-stacked">
             <li #mouseMove [class.active]="activeTab === TabName.Move" (click)="selectTab(TabName.Move)">
                 <a>
@@ -33,7 +33,7 @@
             </li>
         </ul>
     </div>
-    <div class="col-xs-8 macro-mouse__actions" [ngSwitch]="activeTab">
+    <div class="col-xs-9 macro-mouse__actions" [ngSwitch]="activeTab">
         <div #tab *ngSwitchCase="TabName.Move">
             <h4>Move pointer</h4>
             <p>Use negative values to move down or left from current position.</p>