diff --git a/src/App.svelte b/src/App.svelte
index 5bcf594..58501e3 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -26,7 +26,7 @@
       <div class="column is-one-fifth">
         <Sidebar bind:apiKey bind:sortedChats />
       </div>
-      <div class="column is-four-fifths">
+      <div class="column is-four-fifths" id="content">
         {#key $location}
           <Router {routes} />
         {/key}
diff --git a/src/lib/Chat.svelte b/src/lib/Chat.svelte
index e65c50a..27dad4d 100644
--- a/src/lib/Chat.svelte
+++ b/src/lib/Chat.svelte
@@ -162,7 +162,7 @@
   // Scroll to the bottom of the chat on update
   afterUpdate(() => {
     // Scroll to the bottom of the page after any updates to the messages array
-    window.scrollTo(0, document.body.scrollHeight)
+    document.querySelector('#content')?.scrollIntoView({ behavior: 'smooth', block: 'end' })
     input.focus()
   })