Html 转盘项目中的绝对元素位于下一个项目下

在猫头鹰旋转木马中，我的绝对元素（放置在旋转木马项目中）与类“DiscirOption”有问题，该类位于下一个项目之后，几乎无法自己将其向前推进，因此希望您能帮助我

一张我想要的照片：

这里是小提琴：

未更新问题的答案 只需移除

右侧：-30px

。这是工作小提琴：

---

将此类添加到css中，以便使活动幻灯片的z索引高于非活动幻灯片

.owl-item.active {
  z-index: 20;
}

然后为.description类提供以下属性：

.topfeatured .item .description {
    width: calc(100% + 100px);
    padding: 10px 30px;
    height: 150px;
    position: absolute;
    background: #263238;
    bottom: -170px;
    right: -50px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
    transition: 1s ease-in-out;
}

---

老实说，一点也不知道你在问什么。。。项目

.description

实际上位于下一个项目的前面，而不是像您所说的那样位于后面。.您的“项目”需要一个z索引和一个非静态的位置。@Crashtor它是从右到左的，我指的是左项目。好的。我现在明白了。Thanks@Korgrue试试看。。。这不会像我的英文不好：）编辑了这篇文章，并添加了我想要的照片。谢谢你的时间。这不是我想要编辑和添加的内容。看一看更新了我的答案。看我贴上的新小提琴。

.owl-item.active {
  z-index: 20;
}

.topfeatured .item .description {
    width: calc(100% + 100px);
    padding: 10px 30px;
    height: 150px;
    position: absolute;
    background: #263238;
    bottom: -170px;
    right: -50px;
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
    transition: 1s ease-in-out;
}