Shopify themes, liquid, logos, and UX
Hello,
I have liquid code on the dawn theme and have inserted a vimeo video. I need to make the video less wide, center it, and add rounded corners. It is the whole width of the page currently. Here is the custom CSS code I have. What do I need to add?
.video-container {
position: relative;
padding-bottom: 56.25%; /* 16:9 aspect ratio (divide 9 by 16 = 0.5625) */
height: 0;
overflow: hidden;
}
.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
@dhelpwithshop - can you please share this page link?
@dhelpwithshop - please add this css to the very end of your base.css
@media screen and (min-width:750px){
#shopify-section-template--16976905765043__custom_liquid_iXh3yH .video-container iframe {
left: 50% !important;
width: 70% !important;
transform: translate(-50%);
}
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025