diff --git a/theme/src/client/components/Nav/VPNav.vue b/theme/src/client/components/Nav/VPNav.vue
index 2e7633b89..2fe3a00d5 100644
--- a/theme/src/client/components/Nav/VPNav.vue
+++ b/theme/src/client/components/Nav/VPNav.vue
@@ -29,7 +29,7 @@ watchEffect(() => {
 </script>
 
 <template>
-  <div class="vp-nav" :class="{ fixed }">
+  <header v-if="hasNavbar" class="vp-nav" :class="{ fixed }">
     <VPNavbar :is-screen-open="isScreenOpen" @toggle-screen="toggleScreen">
       <template #nav-bar-title-before>
         <slot name="nav-bar-title-before" />
@@ -53,7 +53,7 @@ watchEffect(() => {
         <slot name="nav-screen-content-after" />
       </template>
     </VPNavScreen>
-  </div>
+  </header>
 </template>
 
 <style scoped>
diff --git a/theme/src/client/styles/vars.css b/theme/src/client/styles/vars.css
index bdea427e5..0b209e016 100644
--- a/theme/src/client/styles/vars.css
+++ b/theme/src/client/styles/vars.css
@@ -505,7 +505,7 @@
   --vp-nav-height: 0px;
 }
 
-.hide-nav .sidebar {
+.hide-nav .vp-sidebar {
   --vp-nav-height: 22px;
 }