Darstellungsproblem mit Navi im Safari

[ldb]

Hallo liebe Community, ich habe mal wieder ein Problem und hoffe auf eine schnelle Antwort :)

Ich habe mein erstes Wordpress-Theme aufgebaut, das funktioniert eigentlich alles. Ich wollte es aber nur erwähnen, damit ihr es wisst.

Es geht nämlich eigentlich um ein CSS-Problem:
Wenn ich auf meiner Seite 25.uek-bern.ch
mit Chrome, Firefox oder IE 10 über dem Menüpunkt "Unsere Säfte" hovere, wird das Submenü angezeigt. Im Safari hingegen geschieht etwas sehr seltsames: Das gesamte Menü springt nach unten, dann wieder nach oben, wieder nach unten...

Im mobilen Safari auf dem iPad lässt sich dieses Problem auch beobachten. Auf Android-Smartphones mit Firefox oder Chrome hingegen nicht.

Ich sehe leider im Moment überhaupt nicht mehr, wo das Problem liegen könnte. Habt ihr vielleicht eine Idee?

Vielen Dank schon jetzt für eure Ratschläge!

Lieber Gruss,
Lukas

 

[Bennyville]

Also hier läuft alles wie es soll. Getestet mit Safari 6.1. :)

 

[ldb]

Seltsam... Ich nutze Safari 5.1.7 auf Windows (habe ich vergessen zu erwähnen)

Liegt das vielleicht daran?

 

[Bennyville]

Ich bin hier zwar mit OSX unterwegs, aber es würde mich wundern, da das die aktuellste Version für Windows zu sein scheint.

Müsste ich später zu Hause mal testen.

 

[scbawik]

Seltsam... Ich nutze Safari 5.1.7 auf Windows (habe ich vergessen zu erwähnen)

Liegt das vielleicht daran?

Probiers eben selber in einem anderen Browser ...

Zum Problem:
Es macht anscheinend genau das, was du im CSS festgelegt hast...

nav li:hover .submenu {
    display:block !important;
    height:30px;
    width:0px;
}

Wenn ich width:0px; entferne sieht das Submenü im Safari gleich bescheuert aus wie im Firefox. Das wolltest du ja, oder?
Das height kannst du auch gleich weglassen.

Und bevor jetzt fragst wie du die Submenüs gleich breit machst: nicht floaten, display:block verwenden.