ensures video is sized and centered for mobile, tablet and desktop

adobecom · Dec 17, 2024 · d0f58dd · d0f58dd
1 parent b2a9285
commit d0f58dd
Showing 1 changed file with 10 additions and 2 deletions.
diff --git a/express/blocks/how-to-steps-accordion/how-to-steps-accordion.css b/express/blocks/how-to-steps-accordion/how-to-steps-accordion.css
@@ -119,14 +119,21 @@ main .how-to-steps-accordion.image .image-container {
   overflow: hidden;
 }
 
-main .how-to-steps-accordion.image .image-container img {
+main .how-to-steps-accordion.image .image-container img,
+main .how-to-steps-accordion.video .video-container > * {
   border-radius: 16px;
   max-width: 400px;
   width: 100%;
   height: 100%;
   object-fit: cover;
 }
 
+main .how-to-steps-accordion.video .video-container > * {
+  margin-left: auto;
+  margin-right: auto;
+  height: unset;
+}
+
 main .how-to-steps-accordion.video,
 main .how-to-steps-accordion.image {
   /* note we don't set margin here because background gradient has to go past into this container */
@@ -184,7 +191,8 @@ main .how-to-steps-accordion.image {
     margin: auto;
   }
 
-  main .how-to-steps-accordion.image .image-container img {
+  main .how-to-steps-accordion.image .image-container img,
+  main .how-to-steps-accordion.video .video-container > * {
     max-height: 300px;
     max-width: 533px;
   }