Swiper как центрировать слайд?

Question

[bazliiii]

Добрый день, у меня возникла проблема, что на мобильной версии я в breakpoints поставил отображение одного слайда, но отображается полтора


Код слайдера:

var swiper = new Swiper(".reviews-slider", {
    slidesPerView: 3,
    spaceBetween: 30,
    navigation: {
        nextEl: ".swiper-button-next",
        prevEl: ".swiper-button-prev",
    },
    breakpoints: {
        320: {
            slidesPerView: 1,
            center
        },
        678: {
            slidesPerView: 2
        },
        1120: {
            slidesPerView: 3
        }
    }
});

Верстка:

<div class="reviews__slider-box">
                            <div class="swiper reviews-slider">
                                <div class="swiper-wrapper reviews__wrapper">
                                    <div class="swiper-slide reviews__slide">
                                        <div class="reviews__slide-top">
                                            <img src="./assets/img/rew-1.png" alt="User" class="reviews__slide-user">
                                            <div class="reviews__slide-box">
                                                <h3 class="reviews__slide-name">Rozina Wossala</h3>
                                                <p class="reviews__slide-login">@rozinawossala</p>
                                            </div>
                                        </div>
                                        <div class="reviews__slide-content">
                                            <p class="reviews__slide-text">
                                                @spartisan budapest
                                                AZ EGÉSZ EGY SZUPERCUKI SZIVVEL - LÉLEKKEL ÖSSZERAKOTT
                                                CSALADIVALLALKOZÁS. (a képen toboztea :)
                                            </p>
                                        </div>
                                        <button class="reviews__slide-more"><img src="./assets/img/rew-btn.svg"
                                                alt="svg" class="reviews__btn-img"></button>
                                    </div>
                                    <div class="swiper-slide reviews__slide">
                                        <div class="reviews__slide-top">
                                            <img src="./assets/img/rew-2.png" alt="User" class="reviews__slide-user">
                                            <div class="reviews__slide-box">
                                                <h3 class="reviews__slide-name">kerimmate</h3>
                                                <p class="reviews__slide-login">@kerimmate </p>
                                            </div>
                                        </div>
                                        <div class="reviews__slide-content">
                                            <p class="reviews__slide-text">
                                                Best Sauna experience Thanks to my friend @medvedyev_sergey And the
                                                @spartisan_budapest.
                                            </p>
                                        </div>
                                        <button class="reviews__slide-more"><img src="./assets/img/rew-btn.svg"
                                                alt="svg" class="reviews__btn-img"></button>
                                    </div>
                                    <div class="swiper-slide reviews__slide">
                                        <div class="reviews__slide-top">
                                            <img src="./assets/img/rew-3.png" alt="User" class="reviews__slide-user">
                                            <div class="reviews__slide-box">
                                                <h3 class="reviews__slide-name">Tamás Sas</h3>
                                                <p class="reviews__slide-login">@t_sasss</p>
                                            </div>
                                        </div>
                                        <div class="reviews__slide-content">
                                            <p class="reviews__slide-text">
                                                Koszonom a vendéslátás barávom, Imádiam!
                                                és a megér demelt relax
                                            </p>
                                        </div>
                                        <button class="reviews__slide-more"><img src="./assets/img/rew-btn.svg"
                                                alt="svg" class="reviews__btn-img"></button>
                                    </div>
                                    <div class="swiper-slide reviews__slide">
                                        <div class="reviews__slide-top">
                                            <img src="./assets/img/rew-1.png" alt="User" class="reviews__slide-user">
                                            <div class="reviews__slide-box">
                                                <h3 class="reviews__slide-name">Rozina Wossala</h3>
                                                <p class="reviews__slide-login">@rozinawossala</p>
                                            </div>
                                        </div>
                                        </div>
                                        <div class="reviews__slide-content">
                                            <p class="reviews__slide-text">
                                                @spartisan budapest
                                                AZ EGÉSZ EGY SZUPERCUKI SZIVVEL - LÉLEKKEL ÖSSZERAKOTT
                                                CSALADIVALLALKOZÁS. (a képen toboztea :)
                                            </p>
                                        </div>
                                        <button class="reviews__slide-more"><img src="./assets/img/rew-btn.svg"
                                                alt="svg" class="reviews__btn-img"></button>
                                    </div>
                                </div>
                            </div>
                            <div class="swiper-button-next"></div>
                            <div class="swiper-button-prev"></div>
                        </div>

Comments

[Dimka59]

Скорей всего padding или margin сдигает слайд, center в breakpoints писать не нужно.

[bazliiii]

Dimka59, нет с падингами и манджином все нормально, проверял