Если slick-carousel находится внутри flex обёртки, то при прокрутке слайды исчезают и постоянно увеличивается ширина самой карусели(не говоря уже о том,что overflow:hidden просто не работает почему-то). Мне нужно расположить слева заголовок, а справа саму карусель, метода легче, чем обернуть их flex'ом я не знаю, но если так делать, то карусель ломается. Вот и хотелось бы узнать, почему она ломается и есть ли способ её подружить с flex(видел на сайте, что карусель спокойно находится внутри флекса и всё работает, не могу понять, почему у меня не так) https://codepen.io/tomatobrains/pen/zYrPerz
<div class="qualification">
<div class="qualification__certificate">
<div class="qualification__certificate-descr">
<h3>Сертификаты и дипломы <span class="light">наших мастеров</span></h3>
<div class="qualification__certificate-link borderDashed">
<a class="linkColorRoze" href="/">Смотреть все сертификаты</a>
</div>
</div>
<div class="qualification__certificate-items">
<div class="arrowLeftBot">
<img src="img/qualification/arrowLeft.png" alt="назад">
</div>
<div class="qualification__certificate-wraper">
<div class="qualification__certificate-img">
<img src="img/qualification/flower.png" alt="цветок">
</div>
<div class="qualification__certificate-slider">
<div class="qualification__certificate-item">
<img src="https://bipbap.ru/wp-content/uploads/2017/05/VOLKI-krasivye-i-ochen-umnye-zhivotnye.jpg" alt="сертификат">
</div>
<div class="qualification__certificate-item">
<img src="https://bipbap.ru/wp-content/uploads/2017/05/VOLKI-krasivye-i-ochen-umnye-zhivotnye.jpg" alt="сертификат">
</div>
<div class="qualification__certificate-item">
<img src="https://bipbap.ru/wp-content/uploads/2017/05/VOLKI-krasivye-i-ochen-umnye-zhivotnye.jpg" alt="сертификат">
</div>
<div class="qualification__certificate-item">
<img src="https://bipbap.ru/wp-content/uploads/2017/05/VOLKI-krasivye-i-ochen-umnye-zhivotnye.jpg" alt="сертификат">
</div>
<div class="qualification__certificate-item">
<img src="https://bipbap.ru/wp-content/uploads/2017/05/VOLKI-krasivye-i-ochen-umnye-zhivotnye.jpg" alt="сертификат">
</div>
<div class="qualification__certificate-item">
<img src="https://bipbap.ru/wp-content/uploads/2017/05/VOLKI-krasivye-i-ochen-umnye-zhivotnye.jpg" alt="сертификат">
</div>
</div>
</div>
<div class="arrowRightBot">
<img src="img/qualification/arrowRight.png" alt="назад">
</div>
</div>
</div>
</div>
.qualification {
&__certificate {
display:flex;
padding: 0 6.25vw;
position: relative;
margin-top: 4.792vw;
&-descr {
text-align: left;
width: 14.323vw;
margin-right: 3.906vw;
}
&-items {
margin-left: 22vw;
position: relative;
}
&-link {
display: inline-block;
margin-top: 1.302vw;
& a {
font-size:11px;
}
}
&-wraper {
position: relative;
}
&-img {
position: absolute;
z-index: 2;
left: -8vw;
bottom: -1vw;
width: 20.292vw;
}
}
}
.arrowLeft {
position: absolute;
top: 50%;
left: -7vw;
}
.arrowRightBot {
position: absolute;
top: 50%;
right: -3.5vw;
transform: translate(0, -50%);
}
.arrowLeftBot {
position: absolute;
top: 50%;
left: -6.5vw;
transform: translate(0, -50%);
}
.arrowRight {
position: absolute;
top: 50%;
right: -7vw;
}
.purple {
color: #9770b6;
}