diff --git a/chrome/hide_tabs_with_one_tab.css b/chrome/hide_tabs_with_one_tab.css
index 2e3f574..88a8ecd 100644
--- a/chrome/hide_tabs_with_one_tab.css
+++ b/chrome/hide_tabs_with_one_tab.css
@@ -41,4 +41,9 @@
   height: calc(var(--tab-min-height) + var(--space-above-tabbar) - 1px) !important;
   -moz-appearance: initial !important;
 }
-#nav-bar{ padding: 0 var(--uc-window-drag-space-width,0px) }
+#nav-bar::before,
+#nav-bar::after{
+  content: "";
+  display: -moz-box;
+  width: var(--uc-window-drag-space-width);
+}
diff --git a/chrome/navbar_tabs_oneliner.css b/chrome/navbar_tabs_oneliner.css
index 2667699..c7a6b5d 100644
--- a/chrome/navbar_tabs_oneliner.css
+++ b/chrome/navbar_tabs_oneliner.css
@@ -27,12 +27,15 @@ Window controls will be all wrong without it
 /* This isn't useful when tabs start in the middle of the window */
 .titlebar-placeholder[type="pre-tabs"],
 .titlebar-spacer[type="pre-tabs"]{ display: none }
-#nav-bar{
+#navigator-toolbox > #nav-bar{
 	margin-right:calc(100vw - var(--uc-navigationbar-width));
   margin-top: calc(0px - var(--uc-toolbar-height));
-	padding-right: 0px !important;
 }
 
+/* Override style set in window_control_placeholder_support.css  */
+#nav-bar::after{ display:none !important }
+
+/* Rules specific to window controls on right layout */
 @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
   .titlebar-buttonbox-container{ position: fixed; left: 0px; z-index: 3; }
 }
@@ -41,4 +44,4 @@ Window controls will be all wrong without it
 .tab-close-button{ margin-top: 0 !important }
 
 /* Hide dropdown placeholder */
-#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }
\ No newline at end of file
+#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }
diff --git a/chrome/navbar_tabs_oneliner_tabs_on_left.css b/chrome/navbar_tabs_oneliner_tabs_on_left.css
index 2790841..0c97d70 100644
--- a/chrome/navbar_tabs_oneliner_tabs_on_left.css
+++ b/chrome/navbar_tabs_oneliner_tabs_on_left.css
@@ -41,9 +41,12 @@ Window controls will be all wrong without it
 #nav-bar{
   margin-left: calc(100vw - var(--uc-navigationbar-width));
   margin-top: calc(0px - var(--uc-toolbar-height));
-  padding-left: 0px !important;
 }
 
+/* Override style set in window_control_placeholder_support.css  */
+#nav-bar::before{ display:none !important }
+
+/* Rules specific to window controls on right layout */
 @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
   :root:not([inFullscreen]) #TabsToolbar-customization-target > .titlebar-spacer[type="pre-tabs"]{
     width: var(--uc-window-drag-space-width) !important;
@@ -56,4 +59,4 @@ Window controls will be all wrong without it
 .tab-close-button{ margin-top: 0 !important }
 
 /* Hide dropdown placeholder */
-#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }
\ No newline at end of file
+#urlbar-container:not(:hover) .urlbar-history-dropmarker{ margin-inline-start: -28px; }
diff --git a/chrome/window_control_placeholder_support.css b/chrome/window_control_placeholder_support.css
index 68a421e..70acd6e 100644
--- a/chrome/window_control_placeholder_support.css
+++ b/chrome/window_control_placeholder_support.css
@@ -4,22 +4,26 @@
 /* This file should preferably be imported before other stylesheets */
 
 /* Defaults for window controls on RIGHT side of the window */
+/* Modify these values to match your preferences */
 :root{
-  --uc-window-control-width: 138px;
-  --uc-window-drag-space-width: 24px;
+  --uc-window-control-width: 138px; /* Space reserved for window controls */
+  --uc-window-drag-space-width: 24px; /* Extra space reserved on both sides of the nav-bar to be able to drag the window */
 }
 
-:root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
-  padding-right: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px));
-  padding-left: var(--uc-window-drag-space-width);
+#nav-bar::before,
+#nav-bar::after{
+  content: "";
+  display: -moz-box;
+  width: var(--uc-window-drag-space-width);
 }
+toolbar#nav-bar::after{ width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px)) }
 
 /* Use this pref to check Mac OS where window controls are on left */
 /* This pref defaults to true on Mac and doesn't actually do anything on other platforms. So if your system has window controls on LEFT side you can set the pref to true */
 @supports -moz-bool-pref("layout.css.osx-font-smoothing.enabled"){
 	:root{ --uc-window-control-width: 72px; }
-  :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar{
-  padding-left: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px));
-  padding-right: var(--uc-window-drag-space-width);
+  :root[tabsintitlebar="true"]:not([inFullscreen]) #nav-bar::before{
+    width: calc(var(--uc-window-control-width) + var(--uc-window-drag-space-width,0px))
   }
-}
\ No newline at end of file
+  :root[tabsintitlebar="true"]:not([inFullscreen]) toolbar#nav-bar::after{ width: var(--uc-window-drag-space-width); }
+}