Plyr: If I set height on video element, fullscreen is broken

[MTyson]

If there is a css height/width set on my

How can I force a size on the video, but still support fullscreen?

Example:

<video id='foo' class='afterglow' autoplay='true' controls style='max-height:140px;width:auto;' preload='auto' poster='' style='display: inline-block;'><source src='video/bar.webm' type='video/webm' /></video>

[ericwuu2]

You can try below.

$("button[data-plyr=fullscreen]").on("click", function() {                    
                setTimeout(function() {
                    $("video").css("height", "100%");
                }, 1000)
            });

[dnjstlr555]

I'm having same problem and It's not working.

[meyt]

@MTyson
It's simply will done with pure CSS:

video {
  max-height: 140px;
}
.plyr:fullscreen video{
  max-height: initial;
}

P.S: for best browser compatibility use autoprefixer.