diff --git a/playground/app.vue b/playground/app.vue
index 548772be..5fc2cb6a 100644
--- a/playground/app.vue
+++ b/playground/app.vue
@@ -71,10 +71,10 @@ defineShortcuts({
 
 <template>
   <UApp :toaster="appConfig.toaster">
-    <div class="min-h-screen w-screen overflow-hidden flex flex-col items-center justify-center overflow-y-auto bg-white dark:bg-gray-900" vaul-drawer-wrapper>
-      <UNavigationMenu :items="items" class="border-b border-gray-200 dark:border-gray-800 overflow-x-auto px-2" />
+    <div class="h-screen w-screen overflow-hidden flex min-h-0 bg-white dark:bg-gray-900" vaul-drawer-wrapper>
+      <UNavigationMenu :items="items" orientation="vertical" class="border-r border-gray-200 dark:border-gray-800 overflow-y-auto w-48 p-4" />
 
-      <div class="flex-1 flex flex-col items-center justify-center w-full py-12 px-4">
+      <div class="flex-1 flex flex-col items-center justify-center overflow-y-auto w-full py-12 px-4">
         <NuxtPage />
       </div>
     </div>