Auto Width

Splide will respect the width of each slide if the autoWidth option is true, which allows slides to have their own width.

  • 225
  • 150
  • 180
  • 250
  • 200
  • 225
  • 150
  • 180
  • 250

Basically, you need to set width of each slide by CSS:

<div class="splide">
<div class="splide__track">
<ul class="splide__list">
<li class="splide__slide" style="width: 150px">Slide 01</li>
<li class="splide__slide" style="width: 250px">Slide 02</li>
<li class="splide__slide" style="width: 200px">Slide 03</li>
</ul>
</div>
</div>
HTML

As long as the content of each slide has explicit dimensions, such as an image, you don't have to do that.

Auto Height

In the same way, the autoHeight option is available for the vertical slider.

  • 120
  • 150
  • 100
  • 150
  • 80
  • 120
  • 150
  • 100
  • 150