---

Jeg har et seriøst problem med min eksempelside:

http://webdesign101.dk/www/cssmenu/dropdownmenu/eks10.html

i Windows versionen af Safari. Jeg har fra pålidelig
kilde at problemet også optræder i Safari på Apples
egen computer.

Problemet er, at Safari indsætter et ikke-aktivt
område på 1-2px mellem navbar'ens hovedpunkter
og undermenuerne. Det har den konsekvens, at
der kan indtræde en mouseout hændelse, når musen
føres fra hovedmenupunktet ned i underpunktet.
Med andre ord - den li:hover-tilstand, der skal
holde undermenuen åbne, ophører et øjeblik.

Jeg har kigget på de mest indlysende mulige årsager
uden resultat. Men måske et par friske øjne
kan hjælpe?

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

---

Jørgen Farum Jensen wrote:
> Jeg har et seriøst problem med min eksempelside:
>
> http://webdesign101.dk/www/cssmenu/dropdownmenu/eks10.html
>
> i Windows versionen af Safari. Jeg har fra pålidelig
> kilde at problemet også optræder i Safari på Apples
> egen computer.

Jeg kan godt se problemet. Spørgsmålet er så, om det vil vælte din verden,
hvis du af hensyn til Safari generelt løftede dine undermenuer de par
pixels, der vil få det til at fungere også i Safari.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk

---

Erik Ginnerskov skrev:

> Jeg kan godt se problemet. Spørgsmålet er så, om det vil vælte din verden,
> hvis du af hensyn til Safari generelt løftede dine undermenuer de par
> pixels, der vil få det til at fungere også i Safari.
>

Næh, det er sådan set nemt nok. Se
http://webdesign101.dk/cssmenu/dropdown.html

Problemet er så bare, at den negative margin-top
så også ses i IE, Firefox og Opera, samt at
jeg fortsat ikke kan gennemskue hvorfor.

Jeg er ret led ved at skule lave noget JavaScript
specielt til Safari, men det kan det jo ende med...
--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

---

Jørgen Farum Jensen wrote:

> Problemet er så bare, at den negative margin-top
> så også ses i IE, Firefox og Opera,

Derfor mit spørgsmål om den væltede verden.

> Jeg er ret led ved at skule lave noget JavaScript
> specielt til Safari, men det kan det jo ende med...

Spørgsmålet er bare, hvordan man lige med javascript detekterer Safari.
Derefter skulle det være enkelt at få et scriptet til at udskrive et kald
til en ekstra css-fil, der flytter undermenuerne op på plads - uden at det
får indflydelse på andre browsere.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk

---

Erik Ginnerskov skrev:
> Jørgen Farum Jensen wrote:
>
>> Problemet er så bare, at den negative margin-top
>> så også ses i IE, Firefox og Opera,
>
> Derfor mit spørgsmål om den væltede verden.
>
>> Jeg er ret led ved at skule lave noget JavaScript
>> specielt til Safari, men det kan det jo ende med...
>
> Spørgsmålet er bare, hvordan man lige med javascript detekterer Safari.
> Derefter skulle det være enkelt at få et scriptet til at udskrive et kald
> til en ekstra css-fil, der flytter undermenuerne op på plads - uden at det
> får indflydelse på andre browsere.
>

appVersion indeholder navnet på browseren.
Der hvor det halter for mig er targeting et
element uden id, men med et className, når
DOM ikke understøtter getElementByClassName.

Men det må jeg hellere tage op i client-side
gruppen.

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

---

Jørgen Farum Jensen skrev:
> Jeg har et seriøst problem med min eksempelside:
>
> http://webdesign101.dk/www/cssmenu/dropdownmenu/eks10.html
>
> i Windows versionen af Safari. Jeg har fra pålidelig
> kilde at problemet også optræder i Safari på Apples
> egen computer.

Jeg kan bekræfte at problemet også er der i Mac-udgaven af Safari.

Det ser ud til at kunne løses ved at øge line-height for li til 1.1em, i
stedet for 1em. Hvad det gør af sjove ting i andre browsere, har jeg dog
ikke lige haft tid til at tjekke.

Men prøv selv således:
div#navbar li { position:relative; width:10em; line-height:1.1em; [...]

Det løser problemet fuldstændig i Safari 3.0.4 på Mac. Næsten utroligt
hvad ".1" kan gøre

--
Michael Rasmussen
------------------------------------------------------------------------
»If you don't fail at least 90 percent of the time,
you're not aiming high enough«, Alan Kay.