---
title: "en hover i mozilla uppför sig märkligt - varför?"
type: "forum-thread"
url: "https://www.webforum.nu/amne/html-css/169761-en-hover-i-mozilla-uppför-sig-märkligt-varför"
topic: "HTML & CSS"
topic_url: "https://www.webforum.nu/amne/html-css"
author: "LenaFena"
published: "2008-03-10T09:29:13.000Z"
updated: "2008-03-12T13:11:35.000Z"
replies: 2
views: 285
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/html-css/169761-en-hover-i-mozilla-uppför-sig-märkligt-varför"
---

# en hover i mozilla uppför sig märkligt - varför?

## #1 — LenaFena, 2008-03-10T09:29Z

Jag har två menyrader enligt följande: 

/\* top-meny \*/
\#menycontainer {padding: 0 0 0 0; margin: 0; width: 300px; float: right; }
\#menycontainer ul {margin: 0; padding: 45px 0 0 0; }
\#menycontainer li {display: inline; list-style: none; float: right; padding: 0 0 0 0; color: #4B6578;}
.menycontent {display: block; padding: 7px 10px 7px 10px; background: #4B6578; color: #ffffff; text-align: center; border-right: 1px solid #ffffff; }
a.meny, a.meny:visited {width: 70px; display: block; text-decoration: none;}
a.meny:hover {background: transparent;}
a.meny:hover .menycontent {background: #99B0BF;}
/\* slut top-meny \*/

/\* main-meny \*/
\#menycontainer2 {padding: 0 0 0 0; margin: 0; width: 100%; float: right; }
\#menycontainer2 ul {margin: 0; padding: 20px 0 0 0; width: 100%}
\#menycontainer2 li {display: inline; list-style: none; float: right; padding: 0 0 0 0; color: #4B6578;}
.menycontent2 {display: block; padding: 20px 20px 20px 20px; background: #4B6578; color: #ffffff; text-align: center; border-right: 1px solid #ffffff; }
a.meny2, a.meny2:visited {width: 100%; display: block; text-decoration: none;}
a.meny2:hover {background: transparent;}
a.meny2:hover .menycontent2 {background: #99B0BF;}
a#current .menycontent2 { background: #99B0BF;}

Båda fungerar utmärkt i IE, men i mozilla beter sig den övre menyn (top-menu) märligt i hover-läge. Fägen på länken slår inte om förrän jag pekar ganska högt upp på den, dvs ovanför själva texten.

Vad har jag gjort för fel?

här finns sidan: <https://www.balkanbusinessgroup.com>

Tacksam för svar   :)

Permalänk: https://www.webforum.nu/p/169761

## #2 — joser, 2008-03-12T10:23Z

Utifrån din postade kod: Enklaste lösningen är att få list-boxen att omsluta sitt innehåll:

```
#menycontainer ul {margin: 0; padding: 45px 0 0 0; overflow:hidden}
```

Permalänk: https://www.webforum.nu/p/2087683

## #3 — headbug, 2008-03-12T13:11Z

Att du inte "kommer åt" övre menyn förrän ganska långt upp beror på att du har en padding-top på 20px på din UL i menycontainer2 som lägger sig över din andra meny.

Det blir alldeles uppenbart om du installerar fireFox och web-utvecklarverktyget FireBug (ett måste i varje hemsidesnickrares arsenal, tillsammans med Web developer toolbar :) )

Om du inte kan eller vill ändra hur du styr din positionering kan du styra så att menycontainer2 får ett annat z-värde, dvs du kan lägga menycontainer2 UNDER den övre menyn och på så sätt blir den övre inte blockerad.

Men jag skulle nog rekommendera dig att strama upp koden lite, och till exempel så om du endast använder diven "menycontainer" till att omsluta en ren UL kan du skippa diven och ge din UL id:t istället... Så blir det lite lättare att hålla reda på vilken padding/margin som spökar för tillfället!

Permalänk: https://www.webforum.nu/p/2087717

---

Tråden på webben: https://www.webforum.nu/amne/html-css/169761-en-hover-i-mozilla-uppför-sig-märkligt-varför