diff --git a/daemon/web/src/lib/components/AnalysisTable.svelte b/daemon/web/src/lib/components/AnalysisTable.svelte
index bf9b727..c15d7b9 100644
--- a/daemon/web/src/lib/components/AnalysisTable.svelte
+++ b/daemon/web/src/lib/components/AnalysisTable.svelte
@@ -33,45 +33,49 @@
     {#if report.statistics.num_warnings === 0 && report.statistics.num_informational_logs === 0}
         <p>Nothing to show!</p>
     {:else}
-        <table class="table-auto text-left">
-            <thead class="p-2">
-                <tr class="bg-gray-300">
-                    <th class="p-2">Timestamp</th>
-                    <th class="p-2">Heuristic</th>
-                    <th class="p-2">Warning</th>
-                    <th class="p-2">Severity</th>
-                </tr>
-            </thead>
-            <tbody>
-                {#each report.rows as row}
-                    {#if row.type === AnalysisRowType.Analysis}
-                        {@const parsed_date = new Date(row.packet_timestamp)}
-                        {#each row.events.filter((e) => e !== null) as event, i}
-                            {@const analyzer = analyzers[i]}
-                            <tr class="even:bg-gray-200 odd:bg-white">
-                                {#if event.type === EventType.Warning}
-                                    {@const severity = ['Low', 'Medium', 'High'][event.severity]}
-                                    {@const severity_class = [
-                                        'bg-red-200',
-                                        'bg-red-400',
-                                        'bg-red-600',
-                                    ][event.severity]}
-                                    <td class="p-2">{date_formatter.format(parsed_date)}</td>
-                                    <td class="p-2">{analyzer.name} v{analyzer.version}</td>
-                                    <td class="p-2">{event.message}</td>
-                                    <td class="p-2 {severity_class} text-center">{severity}</td>
-                                {:else if event.type === EventType.Informational}
-                                    <td class="p-2">{date_formatter.format(parsed_date)}</td>
-                                    <td class="p-2">{analyzer.name} v{analyzer.version}</td>
-                                    <td class="p-2">{event.message}</td>
-                                    <td class="p-2">Info</td>
-                                {/if}
-                            </tr>
-                        {/each}
-                    {/if}
-                {/each}
-            </tbody>
-        </table>
+        <div class="overflow-x-scroll">
+            <table class="table-auto text-left">
+                <thead class="p-2">
+                    <tr class="bg-gray-300">
+                        <th class="p-2">Timestamp</th>
+                        <th class="p-2">Heuristic</th>
+                        <th class="p-2">Warning</th>
+                        <th class="p-2">Severity</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    {#each report.rows as row}
+                        {#if row.type === AnalysisRowType.Analysis}
+                            {@const parsed_date = new Date(row.packet_timestamp)}
+                            {#each row.events.filter((e) => e !== null) as event, i}
+                                {@const analyzer = analyzers[i]}
+                                <tr class="even:bg-gray-200 odd:bg-white">
+                                    {#if event.type === EventType.Warning}
+                                        {@const severity = ['Low', 'Medium', 'High'][
+                                            event.severity
+                                        ]}
+                                        {@const severity_class = [
+                                            'bg-red-200',
+                                            'bg-red-400',
+                                            'bg-red-600',
+                                        ][event.severity]}
+                                        <td class="p-2">{date_formatter.format(parsed_date)}</td>
+                                        <td class="p-2">{analyzer.name} v{analyzer.version}</td>
+                                        <td class="p-2">{event.message}</td>
+                                        <td class="p-2 {severity_class} text-center">{severity}</td>
+                                    {:else if event.type === EventType.Informational}
+                                        <td class="p-2">{date_formatter.format(parsed_date)}</td>
+                                        <td class="p-2">{analyzer.name} v{analyzer.version}</td>
+                                        <td class="p-2">{event.message}</td>
+                                        <td class="p-2">Info</td>
+                                    {/if}
+                                </tr>
+                            {/each}
+                        {/if}
+                    {/each}
+                </tbody>
+            </table>
+        </div>
     {/if}
 </div>
 {#if report.statistics.num_skipped_packets > 0}
@@ -81,21 +85,23 @@
             These are due to a limitation or bug in Rayhunter's parser, and aren't ususally a
             problem.
         </p>
-        <table class="table-auto text-left">
-            <thead class="p-2">
-                <tr class="bg-gray-300">
-                    <th scope="col" class="p-2">Total Msgs Affected</th>
-                    <th scope="col">Reason/Error</th>
-                </tr>
-            </thead>
-            <tbody>
-                {#each skipped_messages.entries() as [message, count]}
-                    <tr class="even:bg-gray-200 odd:bg-white">
-                        <td class="text-center">{count}</td>
-                        <td>{message}</td>
+        <div class="overflow-x-scroll">
+            <table class="table-auto text-left">
+                <thead class="p-2">
+                    <tr class="bg-gray-300">
+                        <th scope="col" class="p-2">Total Msgs Affected</th>
+                        <th scope="col">Reason/Error</th>
                     </tr>
-                {/each}
-            </tbody>
-        </table>
+                </thead>
+                <tbody>
+                    {#each skipped_messages.entries() as [message, count]}
+                        <tr class="even:bg-gray-200 odd:bg-white">
+                            <td class="text-center">{count}</td>
+                            <td>{message}</td>
+                        </tr>
+                    {/each}
+                </tbody>
+            </table>
+        </div>
     </div>
 {/if}
diff --git a/daemon/web/src/lib/components/DeleteButton.svelte b/daemon/web/src/lib/components/DeleteButton.svelte
index 5e12941..72656a0 100644
--- a/daemon/web/src/lib/components/DeleteButton.svelte
+++ b/daemon/web/src/lib/components/DeleteButton.svelte
@@ -18,7 +18,7 @@
 </script>
 
 <button
-    class="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded-md flex flex-row"
+    class="bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-2 sm:px-4 rounded-md flex flex-row"
     onclick={confirmDelete}
     aria-label="delete"
 >
diff --git a/daemon/web/src/lib/components/DownloadLink.svelte b/daemon/web/src/lib/components/DownloadLink.svelte
index 8b58354..f42f586 100644
--- a/daemon/web/src/lib/components/DownloadLink.svelte
+++ b/daemon/web/src/lib/components/DownloadLink.svelte
@@ -16,7 +16,7 @@
 
 <button
     class="flex flex-row {full_button
-        ? 'bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded-md'
+        ? 'bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2 sm:px-4 rounded-md'
         : 'text-blue-600 underline'}"
     onclick={download}
 >
diff --git a/daemon/web/src/lib/components/ManifestCard.svelte b/daemon/web/src/lib/components/ManifestCard.svelte
index befbe39..ba5e4c0 100644
--- a/daemon/web/src/lib/components/ManifestCard.svelte
+++ b/daemon/web/src/lib/components/ManifestCard.svelte
@@ -41,7 +41,7 @@
 </script>
 
 <div
-    class="{status_row_color} {status_border_color} drop-shadow p-4 flex flex-col gap-2 border rounded-md flex-1"
+    class="{status_row_color} {status_border_color} drop-shadow p-4 flex flex-col gap-2 border rounded-md flex-1 overflow-x-scroll overflow-y-hidden"
 >
     {#if current}
         <div class="flex flex-row justify-between gap-2">
@@ -78,7 +78,7 @@
                 'N/A'}</span
         >
     </div>
-    <div class="flex flex-row justify-between lg:justify-end gap-2 mt-2">
+    <div class="flex flex-row justify-between lg:justify-end gap-1 mt-2 overflow-x-scroll">
         <DownloadLink url={entry.get_pcap_url()} text="pcap" full_button />
         <DownloadLink url={entry.get_qmdl_url()} text="qmdl" full_button />
         <DownloadLink url={entry.get_zip_url()} text="zip" full_button />
diff --git a/daemon/web/src/lib/components/RecordingControls.svelte b/daemon/web/src/lib/components/RecordingControls.svelte
index 6e0a639..3772fe2 100644
--- a/daemon/web/src/lib/components/RecordingControls.svelte
+++ b/daemon/web/src/lib/components/RecordingControls.svelte
@@ -20,7 +20,7 @@
     }
 
     const recording_button_classes =
-        'text-white font-bold py-2 px-4 rounded-md flex flex-row gap-1';
+        'text-white font-bold py-2 px-2 sm:px-4 rounded-md flex flex-row gap-1';
     const stop_recording_classes = `${recording_button_classes} bg-red-500 opacity-50 cursor-not-allowed`;
     const start_recording_classes = `${recording_button_classes} bg-blue-500 opacity-50 cursor-not-allowed`;
 </script>