diff --git a/src/pages/ChatPage.vue b/src/pages/ChatPage.vue
index 81222e2..e8fd96d 100644
--- a/src/pages/ChatPage.vue
+++ b/src/pages/ChatPage.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="container mx-auto p-4 h-screen">
+  <div class="container mx-auto p-4 h-[calc(100vh-3.5rem-2rem)] lg:h-[calc(100vh-4rem-2rem)] xl:h-[calc(100vh-5rem-2rem)]">
     <div class="flex flex-col h-full">
       <!-- Page Header -->
       <div class="mb-4">