I have a horizontal carousel.

It works fine when holding and swiping the slides, scrolling horizontally.

But when holding and swiping the space between slides, it scrolls vertically instead, which is wrong.

I am wondering how to solve that.

It seems that the spaces between the slides are considered outside the swiper, instead of a part of the swiper.

Here is my config for the swiper HTML element.

  private setSwiperConfig(): void {
    this.swiperConfig = {
      centeredSlides: false,
      spaceBetween: 24,
      slidesPerView: 'auto',
      grabCursor: true,
      allowTouchMove: true,
      shortSwipes: true,
      touchEventsTarget: 'wrapper',
      lazy: true,
      mousewheel: {
        forceToAxis: true
      },
      freeMode: true,
      speed: 500
    };
  }

Please help!

Thanks in advance!