diff --git a/client/src/components/Layout.tsx b/client/src/components/Layout.tsx
index 2c49006..bdc80bf 100644
--- a/client/src/components/Layout.tsx
+++ b/client/src/components/Layout.tsx
@@ -5,7 +5,7 @@ interface LayoutProps {
 function Layout({ children }: LayoutProps) {
   return (
     <>
-      <main className="min-h-screen p-1 sm:p-4">
+      <main className="min-h-screen p-1 py-4 sm:p-4">
         <header className="top-0 w-full bg-white" role="banner">
           <h1 className="text-3xl text-center mb-3">Simple Chat</h1>
         </header>
diff --git a/client/src/components/MessageDisplay.tsx b/client/src/components/MessageDisplay.tsx
index f2ff888..784db63 100644
--- a/client/src/components/MessageDisplay.tsx
+++ b/client/src/components/MessageDisplay.tsx
@@ -92,6 +92,7 @@ function MessageDisplay({ sendMessage }: MessageDisplayProps) {
             width={width}
             itemCount={state.messages.length}
             itemSize={90} // sadly, this will make the system messages really tall. apparently its non trivial to fix that
+            overscanCount={5}
           >
             {Row}
           </List>