猫头鹰旋转木马,显示孩子绝对div,超过父母溢出隐藏div

我正在使用猫头鹰旋转木马2,我正面临以下问题。

我有一个名为owl-stage-outerdiv ,它有overflow:hidden根据轮播的要求overflow:hidden

我有另一个孩子div名称: ribbon (显示’New Arrival’和’Big Sale’)这是position: absolute现在我面临的问题,在旋转木马的第一项,function区因为overflow: hidden

参考图像

我正在工作的链接

我试过这个链接提供的解决方案,但它只适用于直接的孩子。

提前致谢。

你可以添加这个margin-left: 25px; 其作品。

 

编辑:

其作品

添加你的这个container

 

您的owl-stage-outer

 

在此处输入图像描述

这是一个你可以尝试的修复(有点脏,但它有效):

首先你删除overflow: hidden.owl-carousel .owl-stage-outer 。 它会在100%的页面宽度上显示所有滑块,是的。

但是你设定position: relative; .owl-carousel .owl-stage-outer而不是position: static;

然后你添加一个:before就像这样隐藏左边的部分:

 .owl-carousel .owl-stage-outer:before { content: ""; background: #fff; position: absolute; width: 100%; height: 700px; left: -100%; margin-left: -20px; top: 0; z-index: 10; } 

当然你必须做同样的事情:after隐藏正确的内容。

尝试此解决方案

 .owl-carousel .owl-stage-outer { margin: -25px; padding: 25px; }