diff --git a/web/src/views/recording/RecordingView.tsx b/web/src/views/recording/RecordingView.tsx
index 6030352e9..494658e76 100644
--- a/web/src/views/recording/RecordingView.tsx
+++ b/web/src/views/recording/RecordingView.tsx
@@ -30,7 +30,12 @@ import {
   useRef,
   useState,
 } from "react";
-import { isDesktop, isMobile } from "react-device-detect";
+import {
+  isDesktop,
+  isMobile,
+  isMobileOnly,
+  isTablet,
+} from "react-device-detect";
 import { IoMdArrowRoundBack } from "react-icons/io";
 import { useNavigate } from "react-router-dom";
 import { Toaster } from "@/components/ui/sonner";
@@ -621,9 +626,16 @@ export function RecordingView({
                     )
                   : cn(
                       "pt-2 portrait:w-full",
-                      mainCameraAspect == "wide"
-                        ? "aspect-wide landscape:w-full"
-                        : "aspect-video landscape:h-[94%] landscape:xl:h-[65%]",
+                      isMobileOnly &&
+                        (mainCameraAspect == "wide"
+                          ? "aspect-wide landscape:w-full"
+                          : "aspect-video landscape:h-[94%] landscape:xl:h-[65%]"),
+                      isTablet &&
+                        (mainCameraAspect == "wide"
+                          ? "aspect-wide landscape:w-full"
+                          : mainCameraAspect == "normal"
+                            ? "landscape:w-full"
+                            : "aspect-video landscape:h-[100%]"),
                     ),
               )}
               style={{