Responsive Media at top of Page

[aamartines]

Site: http://128.119.164.207/get-involved/

I’ve added some videos to the top of the page on several pages on my site using the Theme General Settings using the Video Self hosted and Video Self hosted Poster settings. However, on a widescreen computer monitor the video isn’t quite responsive because of its aspect ratio. It becomes too tall and you can’t see the entire video, including the controls, on your screen. I’m currently limiting the height of the video player and video with the following CSS:

.article-media .kleo-video {
max-height: 800px;
}

I can’t figure out how to do this for the poster image that appears before the video loads though.

Thanks for the help!

[aamartines]

I’ve decided to just use images that work well enough regardless of screen size.

[Author]

Posts