<p> innerhalb <a> nicht unterstreichen

T

Transporter

Mitglied
Hallo,

ich habe innerhalb eines <a> Links Text mit <p> eingefügt.

<A> hat
PHP: 
a:hover { text-decoration: underline }

<P> soll beim Hovern aber nicht unterstrichen werden.

Im IE, Firefox, Chrome und opera funktioniert es einwandfrei. Im Maxthon und Safari wird der Text immer auch unterstrichen.

PHP: 
p { text-decoration: none }
funktioniert auch nicht!
 
Müsste nicht in der css a {text-decoration: none} stehen? dann würden die <a> tags immer normal sein und sobalt du hoverst werden sie unterstrichen..
CSS: 
also:
a {
text-decoration: none;
}

a:hover {
text-decoration: underline;
}
So kenne ich das zumindest..
 
Zuletzt bearbeitet von einem Moderator:
Hallo,

daß wäre schön, geht aber leider nicht!
<P> wird nur angezeigt wenn <A> gehovert wird. Darum ist
PHP: 
a { text-decoration: none }

und
PHP: 
a:hover { text-decoration: underline }

aber dann leider der innere <p> auch unterstrichen.
Zumindest im Maxthon und Sarafi!
 
Code: 
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style type="text/css">	

span {
 float:right;
 margin-left:5px;
 color:#f00;
}

a  {
 text-decoration:none;
 padding:5px;
 background:#ddd;
 float:left;
}

a:hover {
 text-decoration:underline;
}
</style>
</head>
<body>
<p><a href="#">Linkziel<span>Linktext</span></a></p>
</body>
</html>
So geht's.
 
Hi,
mal die Frage warum benötgst du überhaupt einen Paragraphen innerhalb des Anchor-Elementes?

Nur mal so als Fussmarke, mit einem HTML 5-Doctype wäre das Blockelement auch im Inlinelement erlaubt.
Aber bitte nicht vergessen HTML 5 ist noch in der Entwicklung und nicht jeder Browser kann es vernünftig.

Viele Grüsse
 
threadi hat gesagt.:
Es sollte gehen, wenn Du

Code: 
a:hover span { text-decoration: none; }

ergänzt.
Zum Vergrößern anklicken....

Funtioniert leider auch nicht. Zumindestens im Arora (Safari) nicht. AAABER umgekehrt gehts.

Code: 
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style type="text/css">	

p {
 float:left;
 padding:5px;
 background:#ddd;
}

span {
 float:right;
 margin-left:5px;
 color:#f00;
}

a  {
 text-decoration:none;
 background:#ddd;
 float:left;
}

a:hover span {
 text-decoration:underline;
}

a:active , a:active span {
 color:#000;
}


</style>
</head>
<body>
<p><a href="#">Text-decoration:none<span>text-decoration:underline</span></a></p>
</body>
</html>
 
Zuletzt bearbeitet:
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück