diff --git a/app/assets/javascripts/components/NoteTagsContainer.tsx b/app/assets/javascripts/components/NoteTagsContainer.tsx
index f029e888c..ff0d2e087 100644
--- a/app/assets/javascripts/components/NoteTagsContainer.tsx
+++ b/app/assets/javascripts/components/NoteTagsContainer.tsx
@@ -23,7 +23,7 @@ const NoteTagsContainer = observer(({ application, appState }: Props) => {
 
   return (
       <div
-        className="bg-default flex flex-wrap pl-1 -ml-1"
+        className="bg-default flex flex-wrap pl-1 -ml-1 -ml-2"
         style={{
           maxWidth: tagsContainerMaxWidth,
         }}
diff --git a/app/assets/javascripts/ui_models/app_state/active_note_state.ts b/app/assets/javascripts/ui_models/app_state/active_note_state.ts
index f78e06f9e..9956f4fb0 100644
--- a/app/assets/javascripts/ui_models/app_state/active_note_state.ts
+++ b/app/assets/javascripts/ui_models/app_state/active_note_state.ts
@@ -105,14 +105,10 @@ export class ActiveNoteState {
 
   reloadTagsContainerMaxWidth(): void {
     const EDITOR_ELEMENT_ID = 'editor-column';
-    const defaultFontSize = parseFloat(window.getComputedStyle(
-      document.documentElement
-    ).fontSize);
-    const margins = defaultFontSize * 1.5;
     const editorWidth = document.getElementById(EDITOR_ELEMENT_ID)?.clientWidth;
     if (editorWidth) {
       this.appState.activeNote.setTagsContainerMaxWidth(
-        editorWidth - margins
+        editorWidth
       );
     }
   }
diff --git a/app/assets/stylesheets/_sn.scss b/app/assets/stylesheets/_sn.scss
index c816550f8..15d42111b 100644
--- a/app/assets/stylesheets/_sn.scss
+++ b/app/assets/stylesheets/_sn.scss
@@ -69,6 +69,10 @@
   margin-left: -0.25rem;
 }
 
+.-ml-2 {
+  margin-right: -0.5rem;
+}
+
 .-mr-1 {
   margin-right: -0.25rem;
 }