合并悬停不起作用

时间:2014-02-11 16:04:53

标签: html css hover

<div class="knoppen">
                <a class="test">HOVER?!</a>
                <span class="icon"><a><i class="fa fa-home"></i></a></span>
                <span class="icon"><i class="fa fa-book"></i></span>
                <span class="icon"><i class="fa fa-euro"></i></span>
            </div>

        <div class="sidecontent">
    <ul>
        <li><span class="test"><i class="fa fa-bars"></i></span><a href="formulieren.html">Formulieren</a></li>
        <li><span class="test"><i class="fa fa-share"></i></span>Contactpersonen</li>
        <li><span class="test"><i class="fa fa-pencil"></i></span>Adressen</li>
    </ul>
        </div>

我的CSS:

div.sidecontent {
        margin-left: -30px;
        display: none;
    }

a.test:hover + div.sidecontent
{
    color: red;
    display: block;
    }

有谁知道为什么我的组合悬停在这种情况下不起作用? 在我的测试页面中它可以工作但是当我试图让它在这里工作时......它只是没有:我已经尝试了所有但没有工作结果;

1 个答案:

答案 0 :(得分:2)

看起来你的a.test不是div.sidecontent的邻居,而CSS选择器'+'选择在标签之后立即放置的元素