how to center items in glidejs without change settings

user_16614817 0
Viewed 333

As is seem image below, total item slot is 7, but source are dynamic and sometimes its 3 or 4.. How to centeralize these items properly using glidejs

Source code preview:

<Slider element="glide" options={{ perView: 7 }}>
    {Object.entries(subSliderItems)
    .map(([key, value]) => (
        <div className="glide__slide" key={key}>
        <BoxSubCategory label={key} url={value} />
        </div>
    ))}
</Slider>
glidejs javascript
1 Answers

I just came across this issue today, and after a bit of poking around found the solution to be surprisingly simple.

.glider-track {
    margin: auto;
}

The div .glider-track is added to the dom as a wrapper for your slides so centring them within this will do the trick.

user_4722860
Related