Iframe container size

Author: troubaCreated Apr 10, 2025Updated Oct 3, 2025
Labelsv1

Description

Since the new version, the iframe container class has changed from:

lg-video-cont to lg-media-cont The iframeSize in the style is no longer set appropriately and the iframe overflows its container

This a copy of this closed without resolution issue: https://github.com/sachinchoolur/lightGallery/issues/1679 with more infos

@sachinchoolur I use your library on react and import styles directly from the library. I was not able to make it work with css/scss on stackBlitz so here is a new comparaison:

2.7.2 https://codesandbox.io/p/sandbox/lightgallery2-7-2-chhq3s

iframe container:

<div class="lg-video-cont lg-has-iframe" style="width:523px; height:294.1875px">
       <iframe class="lg-object" frameborder="0" title="All new time tracking. Greater insight." 
       src="https://vimeo.com/groups/114/videos/1017406920" allowfullscreen="true">
       </iframe>
</div>

2.8.2 https://codesandbox.io/p/sandbox/lightgallery2-8-2-kswssl

iframe container:

<div class="lg-media-cont lg-has-iframe" style="width:100%; max-width:100%; height: 100%; max-height:100%">
        <iframe class="lg-object" frameborder="0" title="All new time tracking. Greater insight." 
        src="https://vimeo.com/groups/114/videos/1017406920" allowfullscreen="true">
        </iframe>
</div>

Source: sachinchoolur/lightGallery