Help to make my video responsive ( I may have written code incorrectly)

Hi everyone,

I was hoping someone knows a way I can make my video responsive. I want the “mobile” size to be 500px straight (no responsiveness) but when we reach the large screen I would like the max-width to be 1065px and for it to be responsive if the screen is below that. It could make more sense if you check out the codepen below.

Please note I’m still fairly new so my code is still written not as good as when I have more experience. Thanks!

https://codepen.io/HeidiK/pen/yLLevNm

I’m not quite sure of what you want to say 500px straight but no responsiveness . If you just want to make it responsive then you have to make mobile first approach from the initial designing point if you try to make the page responsive after you done with the whole site in desktop browser then it does not work quite well and you have to rely on too many media queries.500px at this point and 1065px at this break point - thats not how you should go for responsiveness. Even tho i didn’t get what you want to achieve; i did made some enhancements to some things which seemed wrong to me. You can take a look :point_right: Here.
Since you used too many media queries i could not make any more changes ,as it would break the page.

Exactly the response I was looking for! That’s really great. I definitely didn’t ask correctly but super cool! Ill analyze it now and hopefully will see how I approached the responsiveness incorrectly.

One question though… why did you choose that height for the video? Was it for a reason?

Thanks again

sure. If you get stuck again you can inbox me directly. I’ll try to help whenever i’m free :+1:

1 Like

oh sorry.I didn’t notice the height question. I just made it responsive. There is no issue with the height you can play around with it and see what fits your needs. Just always keep it simple

1 Like

Cool sounds good. Do you mind pointing out which styles you edited? It’s hard for me to look though it and find out