diff --git a/www/app/[domain]/transcripts/[transcriptId]/record/page.tsx b/www/app/[domain]/transcripts/[transcriptId]/record/page.tsx
index bde06e46..2d227f57 100644
--- a/www/app/[domain]/transcripts/[transcriptId]/record/page.tsx
+++ b/www/app/[domain]/transcripts/[transcriptId]/record/page.tsx
@@ -93,8 +93,8 @@ const TranscriptRecord = (details: TranscriptDetails) => {
           {status === "processing" ? "Processing meeting" : "Record meeting"}
         </Heading>
 
-        <Flex direction={{ base: "column-reverse", md: "row" }}>
-          <Box w={{ md: "50%" }}>
+        <Flex direction={{ base: "column-reverse", md: "row" }} h={"full"}>
+          <Box w={{ md: "50%" }} h={{ base: "80%", md: "full" }}>
             <TopicList
               topics={webSockets.topics}
               useActiveTopic={useActiveTopic}
diff --git a/www/app/[domain]/transcripts/topicList.tsx b/www/app/[domain]/transcripts/topicList.tsx
index 379b9059..a6e928c6 100644
--- a/www/app/[domain]/transcripts/topicList.tsx
+++ b/www/app/[domain]/transcripts/topicList.tsx
@@ -112,7 +112,7 @@ export function TopicList({
     <Flex
       position={"relative"}
       w={"100%"}
-      h={"100%"}
+      h={"95%"}
       flexDirection={"column"}
       justify={"center"}
       align={"center"}