✔ Link Auszeichnung unterdrücken

[Sprint]

Hallo,

ich habe im Moment das Problem, daß sich eine allgemein verwendete Link Auszeichnung nicht überschreiben läßt. Im allgemein gültigen CSS File wird <a> so ausgezeichnet:

a, td a { color: #fb9819; text-decoration: underline; }
a:visited { color: #ff4b01; font-size: inherit; }
a:hover { color: #fff; font-size: inherit; }

Nun soll in einer Unterseite eine ganze Box von einem <a> Element umschlossen werden. Ja, ich weiß daß das erst ab HTML5 zulässig ist!

<a href="details?artnr=1">
	<div class="artikelbox">
		<img src="../artikel/_img.jpg" alt="" />
		<span class="artikeltitel">titel</span>
		<p>Details / Anfrage</p>
	</div>
</a>

.artikelbox { font-size: 0.8em; background-color: #777; text-decoration: none; position: relative; width: 250px; height: auto; float: left; margin-bottom: 10px; margin-left: 10px; padding: 2px; }
.artikeltitel { color: white; font-size: 11px; font-weight: bold; text-decoration: none; }
.artikelbox img { width: 100px; height: 75px; float: left; margin-right: 2px; border-style: none; border-width: 0; }

Alle Auszeichunugen in der Class artikeltitel werden richtig übernommen. Nur werden alle Texte in der Box als Link behandelt und somit unterstrichen. Ich hab es auch schon in allen möglichen Kombinationen mit a probiert, leider ohne Erfolg. Scheinbar versagt alles, was sonst funktioniert. Wie bekomme ich diese versch... Unterstreichung raus?

 

[timestamp]

Naja irgendwie ist das doch logisch dass die als Link behandelt werden oder? Der a Tag funktioniert ja so, dass alles was zwischen den Start- und Endtag steht als Link behandelt wird. Da bei dir jetzt der ganze div zwischen den Tags steht, wird dies alles als Link behandelt und springt somit auf die Formatierung vom Link an.

 

[Sprint]

Naja irgendwie ist das doch logisch dass die als Link behandelt werden oder? Der a Tag funktioniert ja so, dass alles was zwischen den Start- und Endtag steht als Link behandelt wird. Da bei dir jetzt der ganze div zwischen den Tags steht, wird dies alles als Link behandelt und springt somit auf die Formatierung vom Link an.

Das ist mir schon klar. Es ist nur die Frage, warum ich die Unterstreichung nicht unterdrücken kann, egal wie ich die Klassen allein oder auch im Verbund als .class a oder a.class definiere.

 

[timestamp]

Du musst die Unterstreichung beim a Tag unterdrücken. Nicht bei dessen Inhalt. Du könntest dafür dem umschließenden a Tag eine extra Klasse zuweisen:

a.wrapper:link{
  text-decoration: none;
  /* ... */
}

<a class="wrapper" href="details?artnr=1">
	<div class="artikelbox">
		<img src="../artikel/_img.jpg" alt="" />
		<span class="artikeltitel">titel</span>
		<p>Details / Anfrage</p>
	</div>
</a>

 

[Sprint]

Du musst die Unterstreichung beim a Tag unterdrücken. Nicht bei dessen Inhalt. Du könntest dafür dem umschließenden a Tag eine extra Klasse zuweisen:

a.wrapper:link{
  text-decoration: none;
  /* ... */
}

<a class="wrapper" href="details?artnr=1">
	<div class="artikelbox">
		<img src="../artikel/_img.jpg" alt="" />
		<span class="artikeltitel">titel</span>
		<p>Details / Anfrage</p>
	</div>
</a>

Hm, ist ja eigentlich ganz logisch und auch ganz einfach. Manchmal sehe ich den Wald vor lauter Bäumen nicht.
Danke für den Tip.