悬停li.class时如何显示div.class？

Question

在左侧侧边栏的biztone.co页面上，当鼠标悬停在主目录(#.item-post- .details li)时，我试图在div(侧栏.post-meta)中显示社交共享链接。我已经让它正常工作了，除了div(.item .details .post-meta)出现在悬停框下面的框中。

下面是我为使其正常工作而添加的css脚本。但是，我需要帮助弄清楚为什么它显示在下面的框中，而不是悬停在框中。

.item .details .post-meta { display:none; }
sidebar .recent-post-thumb li:first-child:hover + .item .details .post-meta {
display:block; }
sidebar .recent-post-thumb li:hover + .item .details .post-meta {
display:block; }

任何帮助都是非常感谢的，也会教会我一些新的东西。

Answer 1

选择器需要的是#sidebar .popular-post-thumb li:hover .post-meta，而不是使用+转到下一个dom元素

将sidebar .recent-post-thumb li:hover + .item .details .post-meta更改为

#sidebar .popular-post-thumb li:hover .post-meta

Answer 2

这是因为+符号:它指向下一个元素。

删除它，它将以当前悬停的li中的.post-meta元素为目标。