Unable to get video to fit screen size

Hi Janekkrause,

We just made an update to this plugin which updated to the latest version of the script. This could solve your problem.

Could you update to the latest version of this plugin and give it a try?

Thanks,
Ozzy

Hey Ozzy,

I managed to force the correct sizing through targeting the embedded video element with CSS using the following.

.featherlight-iframe .featherlight-content {
	overflow:visible;
}

.featherlight.video  .featherlight-inner {
   margin:0;
	padding:0;
    min-height: 100vh;
    min-width: 99vw;
}

.featherlight.video .featherlight-content {
	max-width:100vw;
	max-height:100vh;
}

If I remove any of this code it falls back to being a tiny size.

The code I’ve tried in the past to display the video in featherlight is:

<a href="https://www.youtube.com/embed/PGbkXWmRqTQ?rel=0&autoplay=1&showinfo=0&controls=0" data-featherlight="iframe" data-featherlight-iframe-frameborder="0" data-featherlight-iframe-allow="autoplay; encrypted-media" data-featherlight-iframe-allowfullscreen="true" data-featherlight-variant="video" data-featherlight-close-icon="'fullscreen_exit'" data-featherlight-iframe-style="position:fixed;background:#000;border:none;top:0;right:0;bottom:0;left:0;width:100%;height:100%;">

At the moment I’ve removed the featherlight iframe style since it doesnt seem to do anything and used my custom CSS to apply styling.

You can see how it works in its current state on my clients site with the custom CSS.
https://www.fighterpilotpodcast.com/ just click the experience button top right.

Hi janekkrause,

I tried the code that includes the data-featherlight-iframe-style you gave us with version 1.3.0 of the plugin, you’re currently running 1.2.0, and it’s working as expected, although your workaround works as well!

Thanks,
Ozzy