React-slick: How to control the width of slick-track?

[ExtremeRights]

Hey i am using react-carousel to show multiple items and in my one slide there are many variable width divs . The problem is when there is only one div inside one slide then the single div get left aligned and not center aligned. Any suggestions to solve the issue?

[rtmalone]

Have you used flexbox before? It does a stellar job at aligning items. You'd probably need to wrap your many divs in a parent div. Then target that parent div with something like:

.parentDiv {
    display: flexbox;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
}

No matter how many child divs are in your parent div justify-content: space-around will center them and space them evenly. There are other options too. Also, align-items may or may not be needed in your case.

Take a look at this to help you out: Flexbox guide

[ExtremeRights]

Hey @rtmalone . Thank you for your response. Actually i am using already using flex and i have fixed the problem now. Though the problem was something else. I fixed this using custom classes and then setting css for the particular classes.