flickity
flickity copied to clipboard
Is Flickity supposed to work in a CSS Grid layout?
Before I go down the rabbit hole of trying to figure out why it's not working cleanly for — is Flickity compatible with CSS grid? As in, should I be able to place it within a grid-area without the slides showing unexpected behavior?
I can currently only make this work if I give the carousel cells an exact pixel value, making it no longer responsive. If I use 100% width, the cells always end up overlapping, as the value for "left" in the carousel cell is apparently calculated to be an unexpected percentage. This persists until I resize the browser window, after which the cells jump into their respective places and the carousel works fine.
Is this something that I'm doing wrong on my end or is CSS grid not supported at this point?
I'm getting this issue (albeit inconsistently) in CSS Flexbox as well
I just fixed this issue by giving the CSS grid "cell" a min-width
of 0
. no idea why it worked, but it did.