diff --git a/client/src/LobbyChat.tsx b/client/src/LobbyChat.tsx
index b96ad6f..fc1953e 100644
--- a/client/src/LobbyChat.tsx
+++ b/client/src/LobbyChat.tsx
@@ -26,9 +26,12 @@ const LobbyChat: React.FC<LobbyChatProps> = ({ socketUrl, session, lobbyId }) =>
   const [newMessage, setNewMessage] = useState<string>("");
   const [isClearing, setIsClearing] = useState<boolean>(false);
   const messagesEndRef = useRef<HTMLDivElement>(null);
+  const chatMessagesRef = useRef<HTMLDivElement>(null);
 
   const scrollToBottom = () => {
-    messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+    if (chatMessagesRef.current) {
+      chatMessagesRef.current.scrollTop = chatMessagesRef.current.scrollHeight;
+    }
   };
 
   const { sendJsonMessage } = useWebSocket(socketUrl, {
@@ -167,7 +170,7 @@ const LobbyChat: React.FC<LobbyChatProps> = ({ socketUrl, session, lobbyId }) =>
         )}
       </Box>
 
-      <Box className="chat-messages" sx={{ flexGrow: 1, overflowY: "auto", mb: 1 }}>
+      <Box className="chat-messages" sx={{ flexGrow: 1, overflowY: "auto", mb: 1 }} ref={chatMessagesRef}>
         <List dense>
           {messages.length === 0 ? (
             <ListItem>