Le menu CSS déroulant ne fonctionne pas

Question

Je travaille sur ce truc de menu déroulant depuis un moment maintenant et j'ai décidé que je ne pouvais pas le faire par moi-même. J'ai googlé de nombreuses solutions et vu quelques tutoriels YouTube pour les menus de dépôt CSS, mais ils travaillent toujours pour la personne en question mais pas pour moi. J'espère que vous pourrez m'aider.

Les problèmes antérieurs avec d'autres code étaient des mines comme le texte poussant vers le bas ou d'autres choses qui se sont déplacées. C'est la dernière vidéo que j'ai essayée: http://www.youtube.com/watch?v=_mdjwpzzkt8Le problème avec celui-ci est que mon sous-menu n'apparaît plus du tout. C'est là que je me suis arrêté et j'ai décidé que j'avais besoin d'aide.

J'espère que vous pourrez aider avec mon code!

Le code CSS que j'ai maintenant:

#topnav         { z-index:3;
                    padding-top:76px; }

#topnav ul li       { list-style-type:none; 
                    display:inline;
                    float:right;
                    }


#topnav ul li a     { font-family:Arial, Helvetica, sans-serif;
                        font-size:13px;
                        font-weight:bold;
                        text-decoration:none;
                        padding-left:15px;
                        }

#topnav ul li a:link        { color:#00aeef; }
#topnav ul li a:visited     { color:#00aeef; }
#topnav ul li a:active      { color:#f26532; }
#topnav ul li a:hover       { color:#f26532; }
#topnav ul li a:focus       { color:#f26532; }

#topnav li ul           { position:absolute;
                                left:-999em;
                                list-style-type:none;
                                }

#topnav li ul li            { border-top:0px;
                                clear:both;}

#topnav li:hoover ul        { left:auto; }

Le code HTML que j'ai maintenant:

<div id="topnav">
                <ul>
                    <li><a href="contact.html">CONTACT</a></li>
                    <li><a href="blog.html">BLOG</a></li>
                    <li><a href="over ons.html">OVER ONS</a></li>
                    <li><a href="gedragsbeinvloeding.html">GEDRAGSBEINVLOEDING</a></li>
                    <li><a href="onze diensten.html">ONZE DIENSTEN</a>
                        <ul>
                            <li><a href="onderzoek.html">ONDERZOEK</a></li>
                            <li><a href="advies.html">ADVIES</a></li>
                            <li><a href="lezingen.html">LEZINGEN</a></li>
                        </ul>                       
                    </li>
                    <li><a href="index.html">HOME</a></li>
                </ul>
            </div>

Answer 1

Tu as li:hoover. Cela devrait être li:hover

http://jsfiddle.net/68zkk/