diff --git a/docs/_includes/base.njk b/docs/_includes/base.njk
index b258b5227..5a83dc4b2 100644
--- a/docs/_includes/base.njk
+++ b/docs/_includes/base.njk
@@ -43,15 +43,10 @@
 
     <wa-page>
       <header slot="header">
-        {# Nav toggle #}
-        <wa-button appearance="text" data-toggle-nav>
-          <wa-icon name="bars" label="Toggle navigation"></wa-icon>
-        </wa-button>
-
         {# Logo #}
         <div id="docs-branding">
           {# Nav toggle #}
-          <wa-button variant="text" data-toggle-nav>
+          <wa-button appearance="text" data-toggle-nav>
             <wa-icon name="bars" label="Toggle navigation"></wa-icon>
           </wa-button>
           <a href="/" aria-label="Web Awesome">
diff --git a/docs/assets/styles/docs.css b/docs/assets/styles/docs.css
index 356a333d5..afb47aa24 100644
--- a/docs/assets/styles/docs.css
+++ b/docs/assets/styles/docs.css
@@ -49,9 +49,12 @@ wa-page > header {
 
   wa-button[data-toggle-nav] {
     --label-color: currentColor;
-    margin-inline-end: 0.75rem;
+    margin-inline-start: -0.875rem;
+    margin-inline-end: 0;
+
     &::part(base) {
       padding: 0;
+      padding-inline: 0.875rem;
     }
   }