Hvis jeg nu har denne dropdownmenu...
- <div class="dropdownmenu">
-
- <ul>
-
- <li>
- <a>Menu 1</a>
- <ul>
- <li><a href="http://X">X</a></li>
- <li><a href="http://X">X</a></li>
- <li><a href="http://X">X</a></li>
- </ul>
- </li>
-
- <li>
- <a>Menu 2</a>
- <ul>
- <li><a href="http://X">X</a></li>
- <li><a href="http://X">X</a></li>
- <li><a href="http://X">X</a></li>
- </ul>
- </li>
-
- <li>
- <a>Menu 3</a>
- <ul>
- <li><a href="http://X">X</a></li>
- <li><a href="http://X">X</a></li>
- <li><a href="http://X">X</a></li>
- </ul>
- </li>
-
- <ul>
-
- </div>
Så vil jeg gerne have at noget CSS kode kun skal gælde der hvor der står Menu 1 og Menu 2 og Menu 3.
Lad os sige jeg vil sætte baggrundsfarven når man holder markøren over, men det skal også gælde når man bevæger markøren ned på menuen som folder ud.
Det skal altså kun gælde for det første link som er menunavnet men ikke for de link der er i menuen som folder ud.
Denne kode virker lidt som jeg vil have det bortset fra det kun gælder når man har markøren over. Det gælder ikke når man flytter markøren ned på flodudmenuen.
- .dropdownmenu > ul > li > a:hover {
- box-shadow:inset 2px 0 2px rgba(0, 0, 0, 0.5), inset 0 2px 2px rgba(0, 0, 0, 0.5);
- }
Indlæg senest redigeret d. 22.12.2012 13:29 af Bruger #13010