Opera mag Link nicht

[JC Niemeyer]

Hallo!

Ich habe ein Problem mit Opera (6.0). Da der Fehler im "Navigationselement" einer gesamten Internetpräsenz auftritt, ist er besonders ärgerlich.

Zu sehen ist der Fehler unter http://www.theknuddel.com. Der Menü-Link "Knuddel liest" kann mit Opera nur rechts neben dem Text angeklickt werden, sonst nicht.

Der Link ist "harmlos", darunter befindet sich noch ein 100 Pixel breites Blindgif, dessen Entfernung den Fehler nicht beseitigt. Der Link ist CSS-gestaltet, wie alle anderen (richtig funktionierenden) Menüverweise auch.

Weiß jemand Rat?

Danke für jeden sachdienlichen Hinweis (auch für geeignete Archiv/Google-Suchbegriffe),

Jens

[wahsaga]

hi,

Zu sehen ist der Fehler unter http://www.theknuddel.com. Der Menü-Link "Knuddel liest" kann mit Opera nur rechts neben dem Text angeklickt werden, sonst nicht.

hast du vielleicht (absolut) positionierte elemente in der seite, bei denen der opera6 evtl. die position falsch berechnet, und deshalb z.b. ein transparentes element über diesen link legt ...?

gruss,
wahsaga

[JC Niemeyer]

Hi!

hast du vielleicht (absolut) positionierte elemente in der seite, bei denen der opera6 evtl. die position falsch berechnet, und deshalb z.b. ein transparentes element über diesen link legt ...?

Nicht, dass ich wüsste. Und das einzig transparente auf der Seite ist ein Blindgif, dessen Entfernung sich nicht auf den Fehler auswirkt.

Gruß,

Jens

[molily]

Der Link ist "harmlos", darunter befindet sich noch ein 100 Pixel breites Blindgif, dessen Entfernung den Fehler nicht beseitigt. Der Link ist CSS-gestaltet, wie alle anderen (richtig funktionierenden) Menüverweise auch.

Konkret ist padding-bottom:75px; bei .menue dafür verantwortlich, soweit ich das sehen kann. Wieso benutzt du ein und dieselbe Klasse für td und die Link-Elemente? Löse es doch bspw. so:

#menue {width:16%;}
#menue {padding:6px; background-color:#6a7f54; font-weight:bold; line-height:150%;}
#menue a:link, #menue a:active, #menue a:visited, #menue a:hover {color:#ffffff; text-decoration:none; font-weight:bold;}
#menue a:hover {text-decoration:underline;}
#menue b {color:#00df00;}

So kommt padding gar nicht an die Links.

Und im Markup:

<td id="menue" valign="top">
<a href="http://www.theknuddel.com/index.html">Home</a><br>
<a href="http://www.theknuddel.com/knuddel.html"><b>Ich, Knuddel</b></a><br>
<a href="http://www.theknuddel.com/reise-index.html">Auf Reise</a><br>
<a href="http://www.theknuddel.com/karussell.html"><b>Mein Karussell</b></a><br>
<a href="http://www.theknuddel.com/kuehlschrank.html">Kühlschrank</a><br>
<a href="http://www.theknuddel.com/buecher.html"><b>Knuddel liest</b></a><br>
</td>

Das sollte für eine einheitliche Darstellung sorgen, das Blindgif für MSIe sollte mit der prozentualen Breitenangabe meines Wissens überflüssig werden, wobei ich es nicht im 5.x getestet habe, aber das ist ja hier nicht das Problem.

[Elya]

Hallo,

Konkret ist padding-bottom:75px; bei .menue dafür verantwortlich, soweit ich das sehen kann. Wieso benutzt du ein und dieselbe Klasse für td und die Link-Elemente? Löse es doch bspw. so:

genauso ist es auch bei Opera 6.03 (aktuelle Version) für Mac, wenn Du statt der gleichen Klasse einfach der td eine id mit allen Eigenschaften von .menue gibst und .menue dafür rausschmeißt, klappt es sofort einwandfrei.

Hier noch zwei kleine Screenshots  mit Opera, in der alten Variante bricht ein Link auch noch um.

<img src="http://www.visuelya.net/selfpics/knuddel1.gif" border="0" alt="">
(beachte auch die Position des Cursors und welcher Link gehovert wird)

während das Problem mit einem id verschwindet:
<img src="http://www.visuelya.net/selfpics/knuddel2.gif" border="0" alt="">

Es bleibt die kleine Lücke oben im Header.

Übrigens: ultrasüße Seite ;-)

Gruß aus Köln-Ehrenfeld,

Elya

[JC Niemeyer]

»eine id mit allen Eigenschaften von .menue gibst und .menue dafür rausschmeißt,

Auch Dir vielen Dank für den Hinweis, jetzt sieht das Menü so aus, wie es sollte.

» in der alten Variante bricht ein Link auch noch um.

Dass das als Nebeneffekt auch behoben ist, freut mich ebenfalls.

» Es bleibt die kleine Lücke oben im Header.

Jau, auch die war nicht intendiert. Jetzt wo ich dank Euch für padding-Angaben sensibilisiert bin, habe ich das gleich mit beseitigt (war ein Überbleibsel aus einer Zeit, in der sich im Kopf Text befand - und tauchte im Mozilla und IE nicht auf, störte mich daher nicht so gravierend).

» Übrigens: ultrasüße Seite ;-)

Auch dafür: Danke!

Schönes Wochenende,

Jens

[JC Niemeyer]

Konkret ist padding-bottom:75px; bei .menue dafür verantwortlich,

Guter Einfall. Den hatte ich in der "Entwurfs"phase drin, um auch bei leeren Seiten eine Mindesthöhe zu erzwingen. Ist inzwischen unnötig geworden. Danke für den Hinweis!

Und die Lösung über ein id (diese Technik war mir weder bekannt, noch wäre sie mir in den Sinn gekommen) haut hin, danke nochmals.

Schönes Wochenende,

Jens