Link-Problem
Bewerber
- css
0 TorstenA
Hallo,
ich möchte erreichen, dass beim Überfahren eines Links ein 130-Pixel breiter gestrichelter Rahmen angezeigt wird. Im IE funktioniert folgndes CSS:
a.nav:hover {
width:130px;
font-family:Arial;
font-size:12pt;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
border-color:#FFFFFF;
border-style:dashed;
border-width:thin;
}
In Opera wird die Breite ignoriert und der Rahmen "klebt" direkt um den Link. Warum? Wie kann ich das Problem lösen?
MfG,
Bewerber
Hi,
ich möchte erreichen, dass beim Überfahren eines Links ein 130-Pixel breiter gestrichelter Rahmen angezeigt wird. Im IE funktioniert folgndes CSS:
[...]
In Opera wird die Breite ignoriert und der Rahmen "klebt" direkt um den Link. Warum? Wie kann ich das Problem lösen?
Indem du dem Link das Verhalten eines Blocklevel-Elementes durch Zuweisen der Eigenschaft "display:block" aufzwingst. Das a-Element ist von Haus aus ein Inline-Element, insofern ist die Anzeige in Opera korrekt.
Torsten
Hi,
Indem du dem Link das Verhalten eines Blocklevel-Elementes durch Zuweisen der Eigenschaft "display:block" aufzwingst. Das a-Element ist von Haus aus ein Inline-Element, insofern ist die Anzeige in Opera korrekt.
display:block; funktioniert leider nicht, habe es eben ausprobiert.
MfG,
Bewerber
Indem du dem Link das Verhalten eines Blocklevel-Elementes durch Zuweisen der Eigenschaft "display:block" aufzwingst. Das a-Element ist von Haus aus ein Inline-Element, insofern ist die Anzeige in Opera korrekt.
display:block; funktioniert leider nicht, habe es eben ausprobiert.
Hast du nur a.nav:hover das display:block zugewiesen, oder auch a.nav:link?
Torsten
Noch ein Link zur Ergänzung:
http://css.fractatulum.net/sample/hov2format2.htm
Viel Erfolg
Torsten
Hi
Hast du nur a.nav:hover das display:block zugewiesen, oder auch a.nav:link?
Mein CSS sieht nun so aus:
a.nav:link {
display:block;
width:130px;
font-family:Arial;
font-size:10pt;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
border-color:#003399;
border-style:dashed;
border-width:thin;
}
a.nav:visited {
display:block;
width:130px;
font-family:Arial;
font-size:10pt;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
border-color:#003399;
border-style:dashed;
border-width:thin;
}
a.nav:hover {
display:block;
width:130px;
font-family:Arial;
font-size:10pt;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
border-color:#FFFFFF;
border-style:dashed;
border-width:thin;
}
a.nav:active {
display:block;
width:130px;
font-family:Arial;
font-size:10pt;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
border-color:#EEEEEE;
border-style:dashed;
border-width:thin;
}
In Opera geht es immer noch nicht. Noch eine Idee? Ich habe die Links jeweils in einer Tabellenzelle, aber daran kann es eigentlich nicht liegen, da die Zellen wesentlich breiter sind und es im IE ja auch geht.
MfG,
Bewerber
Hallo,
Hast du nur a.nav:hover das display:block zugewiesen, oder auch a.nav:link?
Mein CSS sieht nun so aus:
a.nav {
display:block;
}
a.nav:link, a.nav:visited, a.nav:hover, a.nav:active {
width:130px;
font-family:Arial;
font-size:13px;
font-weight:bold;
color:#FFF;
text-decoration:none;
border-color:#039;
border-style:dashed;
border-width:thin;
}
a.nav:hover {
border-color:#FFF;
}
a.nav:active {
border-color:#EEE;
}
Wichtig ist für den Opera, dass a.nav von Anfang an mit display:block dargestellt wird. Die restlichen Veränderungen sind Vereinfachungen. Die Einheit pt ist für Bildschirmschriften nicht geeignet.
viele Grüße
Axel
Danke!!! Es läuft nun! Ist es möglich dieses CSS auch im NN 4.7 irgendwie zum Laufen zu bringen?
MfG,
Bewerber
Hallo,
Ist es möglich dieses CSS auch im NN 4.7 irgendwie zum Laufen zu bringen?
Ich habe _keine_ Ahnung, glaube aber eher nicht. <ironie>Es ist ja auch nicht möglich, die neuesten Spiele auf einem 286-iger AT mit 2MB RAM zum Laufen zu bringen.</ironie>
Im Ernst: Warum willst Du diesen Museumsbrowser noch unterstützen?
viele Grüße
Axel
Moin!
Danke!!! Es läuft nun! Ist es möglich dieses CSS auch im NN 4.7 irgendwie zum Laufen zu bringen?
NN4 kann kein :hover. Und hat vermutlich Probleme mit display:block für den Link. Also wirst du dort auf diesen Effekt komplett verzichten müssen.
- Sven Rautenberg
moin Bewerber,
nachdem ich mich gut 2 Wochen fast nur mit dem Problem display:block für NN 4.7x rumgeschlagen habe, kann ich mit ruhigem Gewissen sagen, nein.
In einer "Fachzeitschrift" wurde empfohlen, diesen "Block" durch zu erzwingen, aber dies kann und sollte keine Lösung sein.
mfg. YLT
Hallo Axel,
Vielen Dank für deinen Beitrag. Als ich ihn durchlas, dämmerte mir, daß dies die Lösung für mein Anzeigeproblem bezüglich meinem Menü in Opera sein könnte.
Tatsächlich war es das auch, nun funktioniert mein Menü auch im Opera 6.04 fast wie gewünscht.
Nochmals Danke, auch wenn du nichts von deiner guten Tat wusstest. ;-)
Gruß
Kurt