CSS显示div悬停不起作用

Question

我无法在将鼠标悬停在其他div上时显示div。我确定我错过了一些非常基本的东西。

.sidebarRightWork:hover .description {
display:block;}

.description { width:100%; height:100%; margin: 0 auto; position:absolute; background-color:#D4D4D4; z-index:15; display:none;}

修改的

正如您所看到的，当您将鼠标悬停在“信息”上时，没有任何事情像在您的小提琴中那样发生（https://jsfiddle.net/lmgonzalves/f1c3vc0y/3/）。

Answer 1

您需要+（adjacent sibling）选择器，因为.description不是.sidebarRightWork的后代，而是下一个兄弟。就像：

.sidebarRightWork:hover + .description {
    display:block;
}

DEMO

修改

然后你还需要：

.sidebarRightWork:hover + .description, .description:hover {
    display:block;
}

DEMO2

请注意，我已定位.description以填满整个屏幕。你可以按照你想要的方式去做;）