Как пофиксить обрезание box-shadow в swiper slide?

Question

[jack iakovenko]

всем привет.вот у меня есть слайдеры в проекте у которых разние slidesPerView, есть 3, 4, и 6. так вот когда я задаю слайдеру overflow: hidden чтоб лишнее скриыть то слайдер обрезает тени у карточек внутри слайдов ... может кто поможет решить проблему?вот сам код

Comments

[Сергей delphinpro]

Ну а у самого-то идеи есть?
Подсказка: саму обрезку пофиксить нельзя.

[Ankhena]

Просто же: раз нельзя убрать overflow, нужно сделать так, чтобы тень умещалась в контейнер.

[jack iakovenko]

Сергей delphinpro, Ankhena, ну помогает паддинг и отрицательный марджин но в таком случае если у слайдера параметр slidesPerView: 3 то выскакивает и четрвертый слайд

[Ankhena]

jack iakovenko, проще всего обернуть слайд в обертку и тень задавать внутренней части.

[Сергей delphinpro]

jack iakovenko, ну скройте четвертый слайд. например стилем opacity: 0;
отталкивайтесь от селектора активного слайда и дальше сиблинг-селектором

[Сергей delphinpro]

jack iakovenko, условно:

.active + .slide {}
.active ~ .slide {}

Answer 1

[Евгений]

только с помощью padding на обертке у которой overflow: hidden

Comments

[jack iakovenko]

если даю паддинги слайдеру то если напр стоит slidesPerView: 3 то появляеться и четвертый слайд

[Евгений]

jack iakovenko, нужно увеличивать space-between