Hey)
https://juzzlejewelry.com/collections/chakra-ring-limited-edition
I have normal size Video section.
but if I download any cover it looks like a big one for 2 screens
How can I fix the size?
Topic summary
Issue: On a Shopify collection page, the video section appears normal, but any uploaded cover (thumbnail) displays extremely large (spanning about two screens), while the actual video remains small.
Context: Link to the affected page was shared. Two screenshots are central to illustrating the mismatch in sizes.
Proposed fix: Add CSS in theme code (Online Store > Themes > More > Edit code, then base.css):
- deferred-media { padding-bottom: 0% !important; }
- deferred-media iframe { width: 100% !important; height: 100% !important; }
Current outcome: The CSS change partially improves the issue on mobile, but produces no change on desktop.
Status: Unresolved/ongoing. Desktop sizing still problematic; additional desktop-specific CSS or theme layout adjustments are needed to fully fix the cover/video size alignment.
Hi @AnaJJ ,
As I understand it, your video thumbnail is very big but your video is very small.
You can use the following solution:
In the Online store, select Themes → More → Edit code
In the base.css file, add the following code at the end of the file:
deferred-media{
padding-bottom:0%!important;
}
deferred-media iframe{
width:100%!important;
height:100%!important;
}
Hope it helps @AnaJJ
Hey!
Thanks a lot!
But it helped partially only on mobile. But nothing changed on desktop version
https://juzzlejewelry.com/collections/chakra-ring-limited-edition