Empty spae/gap after refresh and moving slider

Checks

[X] Not a duplicate.
[X] Not a question, feature request, or anything other than a bug report directly related to Splide. Use Discussions for these topics: https://github.com/Splidejs/splide/discussions

Version

0.7.12

Description

Hello! Thank you for your work!

Have an issue with slider and i couldn't find similar problem in issues. I have request to make infinite vertical loop with centered slide.

What i wrote:

` <Splide hasTrack={false} options={{ rewind: true, width: 300, type: 'loop', direction: 'ttb', height: '150px', perPage: 3, drag : 'free', focus : 'center', trimSpace: true }} className="swiper"

{swiperLenght.map((item, index) => ( {item} ))}
`

styles:

` .swiper { overflow: hidden; border: 1px solid grey; display: flex;

  .splide__slide{
    height: 40px;
    font-size: 36px;
  }

} `

What i see:

after refresh there are no numbers at all:

after start move i see gaps on top and bottom:

Help please to fix this. Respect

Reproduction Link

No response

Steps to Reproduce

copy my code

Expected Behaviour

infinite vertical loop with centered slide without empty spaces

Splidejs / splide