diff --git a/src/app/(content)/lessons/[slug]/embed/_components/embed-lesson.css b/src/app/(content)/lessons/[slug]/embed/_components/embed-lesson.css index 606949a79..eb9cb9d8f 100644 --- a/src/app/(content)/lessons/[slug]/embed/_components/embed-lesson.css +++ b/src/app/(content)/lessons/[slug]/embed/_components/embed-lesson.css @@ -1,11 +1,20 @@ .cueplayer-react .cueplayer-react-video-wrapper { - display: flex; - justify-content: center; + position: relative; + padding-top: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */ width: 100%; - height: 100%; + height: 0; /* Height is controlled by padding */ max-width: 100vw; } +/* Position video element absolutely within the wrapper */ +.cueplayer-react .cueplayer-react-video-wrapper video { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + .cueplayer-react-controls-holder { width: 100%; margin: 0 auto;