css - 将鼠标悬停在 DIV 上时如何防止下面的 DIV 向上滑动

Question

当我将鼠标悬停在一个 DIV 上时，我遇到了一些麻烦，下面的 DIV 在我悬停的 DIV 下方向上滑动。怎么能顶他们呢？

这是一个jsfiddle来说明问题。

Answer 1

在您的 CSS 中：

.calendar-event:hover {
    overflow: visible;
    background: none repeat scroll 0 0 #FAFAFA;
    border: solid 1px #999999;
    width: auto;
    line-height: 1.5em;
    height: auto;
    position: absolute;
}

问题是最后一个属性。删除“位置：绝对；”；这导致 div 脱离浏览器的正常定位流程。

Answer 2

我在尝试修复另一个问题时无意中解决了这个问题：

我改变了这个：

.calendar-event:hover { overflow: visible; background: none repeat scroll 0 0 #FAFAFA; border: solid 1px #999999; width: auto; line-height: 1.5em; height: auto; position: absolute; }

对此：

.calendar-event:hover .event-title { overflow: visible; background: none repeat scroll 0 0 #FAFAFA; border: solid 1px #999999; width: auto; line-height: 1.5em; height: auto; position: absolute; }

它解决了我的问题。