Sven
Sven

Reputation: 13275

CSS dropdown-menu: Hover does not do anything

Short ans sweet: Why does :hover does not display the hidden content? I've tried everything, from display: block: to #trigger a:hover.

Here is the testcase: http://jsfiddle.net/5egvV/

Upvotes: 1

Views: 351

Answers (1)

Adam Kiss
Adam Kiss

Reputation: 11859

Two problems:

1. Wrong CSS selector

You have:

#trigger:hover ul ul {

It should be:

#trigger:hover ul {

2. Wrong HTML

You have:

<li id="trigger"><a href="#" title="#">Mainitem 1</a></li>
    <ul>
        <li><a href="#">Subitem 1</a></li>
        <li><a href="#">Subitem 2</a></li>
        <li><a href="#">Subitem 3</a></li>
    </ul>

It should be:

<li id="trigger"><a href="#" title="#">Mainitem 1</a>
    <ul>
        <li><a href="#">Subitem 1</a></li>
        <li><a href="#">Subitem 2</a></li>
        <li><a href="#">Subitem 3</a></li>
    </ul>
</li>

<ul> should go into <li>

Upvotes: 7

Related Questions