diff --git a/app/soapbox/features/chats/components/chat-page/chat-page.tsx b/app/soapbox/features/chats/components/chat-page/chat-page.tsx
index 74a2e01b4..062aa5b18 100644
--- a/app/soapbox/features/chats/components/chat-page/chat-page.tsx
+++ b/app/soapbox/features/chats/components/chat-page/chat-page.tsx
@@ -21,7 +21,10 @@ const ChatPage = () => {
     const { top } = containerRef.current.getBoundingClientRect();
     const fullHeight = document.body.offsetHeight;
 
-    setHeight(fullHeight - top);
+    // On mobile, account for bottom navigation.
+    const offset = document.body.clientWidth < 976 ? -61 : 0;
+
+    setHeight(fullHeight - top + offset);
   };
 
   useEffect(() => {
diff --git a/app/soapbox/pages/chats-page.tsx b/app/soapbox/pages/chats-page.tsx
index 08bdf078f..ae9f5d6d9 100644
--- a/app/soapbox/pages/chats-page.tsx
+++ b/app/soapbox/pages/chats-page.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 /** Custom layout for chats on desktop. */
 const ChatsPage: React.FC = ({ children }) => {
   return (
-    <div className='md:col-span-12 lg:col-span-9 pb-16 sm:pb-0'>
+    <div className='md:col-span-12 lg:col-span-9'>
       {children}
     </div>
   );