Pro Video Element (v2) Poster Image (Background) Quick Fix

Support
#1

Hi. I’ve discovered that Poster Image in Pro Video Element is not responsive to the layout. So here is a quick fix:

/* Responsive Image Poster for v2 Pro Video Element */

.mejs-video .mejs-poster {
  background-size: cover;
  background-repeat: no-repeat;
}

.mejs-video .mejs-poster img {
    object-fit: cover;
}

I think it might be fixed in next updates. There is no reason to have non-responsive elements in 2019.

#2

Hi Philipp,

It is responsive by default. No need to add that custom CSS. Would you mind sharing a URL where you have encountered this posted image is not responsive. We will investigate what is happening and why responsiveness is not taking place. Thank you.

#3

Here you go :slight_smile:

#4

Same issue, i think.

#5

Hello Philipp,

Thanks for this feedback. Just keep in inform that we used contain on purpose. That is because with cover, the poster image will cover the entire video section with a slightly cut off poster image depending on how big is the video. Compared to contain, the poster image will always display the full image without the side of the image being cut off.

Hope this explains it briefly.

#6

Till there is no toggle for this, anyone can use this code, so :upside_down_face:

#7

Thanks for sharing this code.
It will be useful for other users too.

1 Like
#8

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.