metafizzy / flickity

:leaves: Touch, responsive, flickable carousels
https://flickity.metafizzy.co
7.52k stars 605 forks source link

Flickity full screen does not seem to work with bootstrap navbar fixed #953

Closed sbalet closed 5 years ago

sbalet commented 5 years ago

When using flickity with a bootstrap 4 navbar that is fixed to the top, the fullscreen flickity goes under the navbar, hiding the reduce button and top of the images.

Any solution for this ?

Here is my test case: https://codepen.io/stebal/pen/mZPNzV

desandro commented 5 years ago

Thanks for reporting this issue. Looks like Bootstrap has

.fixed-top { z-index: 1030; }

So you could resolve this with CSS, adding

.flickity-enabled.is-fullscreen { z-index: 1050; }

See demo https://codepen.io/desandro/pen/abd932f51911b68067f62d93cc53fd09