How to fix box shadow on items in owl carousel being cut off
Описание
If you use the owl carousel library and the website design has box-shadow with items, then the two outermost items will be cut off. Today I will give 1 solution to solve this problem.
- You leave the default CSS property of the owl carousel library
Default is:
.owl-carousel .owl-stage-outer {
overflow: hidden;
}
converted into:
.owl-carousel .owl-stage-outer {
overflow: visible;
}
.block-slider .owl-carousel .owl-stage-outer .owl-item {
opacity: 0;
cursor: none;
pointer-events: none;
visibility: hidden;
}
my config, there are 3 items active:
.block-slider .owl-carousel .owl-stage-outer .owl-item.active {
opacity: 1;
pointer-events: auto;
cursor: pointer;
visibility: visible;
}
.block-slider .owl-carousel .owl-stage-outer .owl-stage {
cursor: none;
pointer-events: none;
}
and in the outermost class:
.block-slider {
overflow: hidden;
}
work perfexctly
Рекомендуемые видео



















