Change Video Size Dawn Theme

[TDDFC]

I have added the following code to base.css so that on the home page on a desktop divice I can have three videos across the page using custom liquid in the themes editor. . See here: www.thedeliciousdogfoodcompany.co.uk

/* any screen equal to or wider than 750px */
@media only screen and (min-width: 750px) {
video {
max-width: 32.9% !important;
}

However, if I add a video to the product media it only comes 1/3 of the width of the product media which is too small.

Is there any easy way to have videos on a page 1/3 the page width and videos in the product media 100% width.

I have very limited coding experience so any help/advice would be greatly appreciated. Thanks

[PageFly-Richard · Accepted solution]

Hi @TDDFC 

This is Richard from PageFly - Shopify Page Builder App

You can replace your code with my code below to not apply the style for media video

/* any screen equal to or wider than 750px */
@media only screen and (min-width: 750px) {
video:not(.product video) {
max-width: 32.9% !important;
}

Hope this can help you solve the issue 

Best regards,

Richard | PageFly