diff --git a/web/chat/chat-message-list-container.css b/web/chat/chat-message-list-container.css
--- a/web/chat/chat-message-list-container.css
+++ b/web/chat/chat-message-list-container.css
@@ -1,7 +1,6 @@
 div.container {
   flex: 1;
   overflow: hidden;
-  background-color: var(--bg);
   display: flex;
   flex-direction: column;
 }
diff --git a/web/chat/chat-message-list.css b/web/chat/chat-message-list.css
--- a/web/chat/chat-message-list.css
+++ b/web/chat/chat-message-list.css
@@ -1,6 +1,6 @@
 div.outerMessageContainer {
   position: relative;
-  height: calc(100vh - 128px);
+  height: 100%;
   min-height: 0;
   display: flex;
   flex-direction: column;
@@ -10,6 +10,7 @@
   overflow-y: auto;
   display: flex;
   flex-direction: column-reverse;
+  padding-bottom: 16px;
 }
 div.mirroredMessageContainer {
   flex-direction: column !important;
@@ -26,6 +27,7 @@
   display: flex;
   flex-direction: column;
   flex-shrink: 0;
+  padding: 0 8px;
 }
 
 div.loading {