diff --git a/net/web/src/session/conversation/Conversation.jsx b/net/web/src/session/conversation/Conversation.jsx
index 22941ed0..a4482d96 100644
--- a/net/web/src/session/conversation/Conversation.jsx
+++ b/net/web/src/session/conversation/Conversation.jsx
@@ -1,6 +1,7 @@
 import { useEffect, useRef } from 'react';
 import { ConversationWrapper, StatusError } from './Conversation.styled';
 import { ExclamationCircleOutlined, SettingOutlined, CloseOutlined } from '@ant-design/icons';
+import ReactResizeDetector from 'react-resize-detector';
 import { useConversation } from './useConversation.hook';
 import { Logo } from 'logo/Logo';
 import { AddTopic } from './addTopic/AddTopic';
@@ -9,9 +10,6 @@ import { List, Spin, Tooltip } from 'antd';
 
 export function Conversation({ closeConversation, openDetails, cardId, channelId }) {
 
-  const height = useRef(0);
-  const latch = useRef(null);
-
   const { state, actions } = useConversation(cardId, channelId);
   const thread = useRef(null);
 
@@ -21,18 +19,12 @@ export function Conversation({ closeConversation, openDetails, cardId, channelId
 
   // an unfortunate cludge for the mobile browser
   // scrollTop not updated without a scroll event
-  useEffect(() => {
-    latch.current = setInterval(() => {
-      if (thread.current && height.current !== thread.current.scrollHeight) {
-        height.current = thread.current.scrollHeight;
-        if (thread.current.scrollTop === 0) {
-          thread.current.scrollTo({ top: -16, left: 0, behavior: 'smooth' });
-          thread.current.scrollTo({ top: 0, left: 0, behavior: 'smooth' });
-        }
-      }
-    }, 1000);
-    return () => clearInterval(latch.current);
-  }, []);
+  const latch = () => {
+    if (thread.current && thread.current.scrollTop === 0) {
+      thread.current.scrollTo({ top: -16, left: 0, behavior: 'smooth' });
+      thread.current.scrollTo({ top: 0, left: 0, behavior: 'smooth' });
+    }
+  }
 
   const scrollThread = (e) => {
     const content = thread.current?.scrollHeight;
@@ -81,8 +73,15 @@ export function Conversation({ closeConversation, openDetails, cardId, channelId
           <div class="empty">This Topic Has No Messages</div>
         )}
         { state.topics.length !== 0 && (
-          <List local={{ emptyText: '' }} itemLayout="horizontal" dataSource={state.topics}
-              size="large"  gutter="0" renderItem={topicRenderer} />
+          <ReactResizeDetector handleHeight={true}>
+            {() => {
+              latch();
+              return (
+                <List local={{ emptyText: '' }} itemLayout="horizontal" dataSource={state.topics}
+                  size="large"  gutter="0" renderItem={topicRenderer} />
+              );
+            }}
+          </ReactResizeDetector>
         )}
         { state.loadingInit && (
           <div class="loading">