Добрый день , кто знает как сдвинуть pagination в swiper slidere. Пробовал прописать absolute , но реакции ноль , вот код:
<div class="swiper doctor-slider">
<div class="swiper-wrapper doctor-slider__wrapper">
<div class="swiper-slide doctor-slider__slide">
<img src="images/doctor--1.jpg" alt="img" class="doctor-slider__img">
<h5 class="doctor-slider__item-title">Мінаєва Л.В.</h5>
<p class="doctor-slider__text">Фахівець діагностики захворювань ротової порожнини та терапевтичної
стоматологічної допомоги</p>
</div>
<div class="swiper-slide doctor-slider__slide">
<img src="images/doctor--2.jpg" alt="img" class="doctor-slider__img">
<h5 class="doctor-slider__item-title">СУХОРУКОВА Н.В.</h5>
<p class="doctor-slider__text">Фахівець з гігієни порожнини рота та профілактики захворювань пародонту</p>
</div>
<div class="swiper-slide doctor-slider__slide">
<img src="images/doctor--3.jpg" alt="img" class="doctor-slider__img">
<h5 class="doctor-slider__item-title">Мінаєва Л.В.</h5>
<p class="doctor-slider__text">Фахівець діагностики захворювань ротової порожнини та терапевтичної стоматологічної допомоги</p>
</div>
<div class="swiper-slide doctor-slider__slide">
<img src="images/doctor--2.jpg" alt="img" class="doctor-slider__img">
<h5 class="doctor-slider__item-title">Мінаєва Л.В.</h5>
<p class="doctor-slider__text">Фахівець з протезування зубів та протезування на імплантах</p>
</div>
</div>
<div class="swiper-button-prev swiper-button-prev1"></div>
<div class="swiper-button-next swiper-button-next1"></div>
<div class="swiper-pagination swiper-pagination1"></div>
</div>
var Slider = new Swiper(".doctor-slider", {
slidesPerView: 4,
spaceBetween: 80,
centeredSlides: true,
pagination: {
el: ".swiper-pagination",
type: "progressbar",
},
navigation: {
nextEl: ".swiper-button-next1",
prevEl: ".swiper-button-prev1",
},
});
&__item-title{
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
font-size: 20px;
line-height: 20px;
text-transform: uppercase;
color: #fff;
margin-bottom: 10px;
}
&__text{
max-width: 290px;
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
font-size: 14px;
line-height: 18px;
color: #D9D9D9;
}
&__img {
margin-bottom: 20px;
}
.swiper {
width: 100%;
height: 100%;
&::before{
display: none;
}
}
.swiper-slide {
background: transparent;
}
.swiper-slide img {
display: block;
width: 417px;
height: 417px;
object-fit: cover;
}
&__inner{
position: relative;
.swiper-pagination{
position: absolute !important;
bottom: 150px; left: 0;
}
}