Flickity Viewport height not consistent and too small until window resize

I have a slider, and flickity is inside that slider. 6 slides in total, the first 4 slides load fine mostly, the last 2 load as viewport-height 25px until the window is resized then the viewport-height readjusts to the full image size in it as intended.

Current options are as follows: jQuery(document).ready(function($){ $('.main-carousel').flickity({ // options cellAlign: 'left', imagesLoaded: true, setGallerySize: true, contain: true }); });

I tried adaptiveHeight and other options but nothing worked. Tried one solution in another post where adding padding-top: x% then margin-top: -x% and didn't work.

Also, this happens on first load 100% of the time, but after that it happens randomly sometimes yes sometimes no.

Any ideas appreciated. Thanks.

metafizzy / flickity

Flickity Viewport height not consistent and too small until window resize #1263