Text und Grafik im link -> Firefox unterstreicht alles

Status
Nicht offen für weitere Antworten.
L

Layna

Erfahrenes Mitglied
Hallo :)
Ok, ich habe ein Problem.. deswegen bin ich hier ;).
Jedenfalls habe ich auf einer neuen Seite von mir Links, zu denen sowohl eine Grafik als auch ein Text gehört. Jezt sollen wenn ich mit der Maus da drüber gehe der TEXT unterstrichen werden... und die Grafik natürlich NICHT,
Wie kann ich das bewerkstelligen?
 
Hallo!

Ohne auch nur eine Zeile von deinem Code gesehen zu haben....
Code: 
img { border:0px; }
a:hover { text-decoration:underline; }
Gruss Dr Dau
 
Das habe ich schon...
Einstelugnen für die links:
Code: 
#main a, #main a:visited { color:#0080FF;
	text-decoration:none;}
#main a:active, #main a:focus, #main a:hover { color:Aqua;
	text-decoration:underline; }

Und das Problem kommt halt wenn ich

HTML: 
<a href=..><img...>Irgendein text</a>

habe.

Code: 
#main a:active img, #main a:focus img, #main a:hover img { 
	text-decoration:none; }

habe ich aus Verzweiflung auch schon versucht, ging auch nicht.
 
Den letzten Code lass mal ganz weg und mach beim Bild eine Direktformatierung.
HTML: 
<img src="blabla.jpg" style="border:0px;" alt="">
[edit] Du weisst aber dass Du ID's nur einmalig verwenden darfst? [/edit]
 
Aufbau mit Klassen anstatt mit ID's, somit kannst Du das Style für beliebig viele Links verwenden.
Die Reihenfolge für die Linkformatierungen ist einzuhalten.
Der Rest denke ich, ist selbsterklärend. ;)
HTML: 
<html>
<head>
<style type="text/css">
.image_linkliste
	 {
	 border: 0px;
	 }
 
.linkliste:link
	 {
	 text-decoration: none;
	 color: #0080FF;
	 }
 
.linkliste:visited
	 {
	 text-decoration: none;
	 color: #0080FF;
	 }
 
.linkliste:hover
	 {
	 text-decoration: underline;
	 color: Aqua;
	 }
</style>
</head>
<body>
	 <a href="blabla.html" class="linkliste"><img src="blabla.jpg" alt="" class="image_linkliste">blabla</a>
</body>
</html>
 
Ok...
Erstmal zur Erklärung: #main ist die klasse eines div's, weil ich diese Formatierung nur in Link in eben diesem div haben will.. und die ID main verwende ich auch nur einmal :).
Und mein problem bleibt leider bestehen(auch mit allen ansätzen hier und den dazugehörigen abwandlungen)... Firefox macht eine Unterstreichung unter das BILD...
Ich schick mal 'ne Grafik mit.
Der blaue Strich unter dem Banner ist KEIN Rand, es ist ein Unterstreichung, wie beim Text.
Den möchte ich loswerden ohne auf die Krüppellösung zu kommen der Grafik und dem Text einen jeweils eigenen Link zuzuordnen.
 

Anhänge

  • normal.jpg
    normal.jpg
    38,4 KB · Aufrufe: 119
  • focus.jpg
    focus.jpg
    39,5 KB · Aufrufe: 116
#main ist keine Klasse, sondern eine ID.
Klassen können mehrfach verwendet werden, Du kannst sie aber auch nur einmalig verwenden.
Ich befürchte aber dass das Problem woanders steckt.
Wenn ich es so mache:
HTML: 
<a href="blabla.html" class="linkliste"><img src="blabla.jpg" alt="" class="image_linkliste"><br>blabla</a>
ist der Text unter dem Bild.
Und trotzdem hat das Bild weder eine Umrandung, noch eine Unterstreichung.
Getestet im IE, Opera und Mozilla.
Soll der Text nur unterstrichen werden oder unter- und überstrichen?
Am besten postest Du mal den gesamten Quelltext und die gesamte CSS-Datei.
Wenn es zuviel ist, hänge es als ZIP an.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück