Style wird nicht korrekt übernommen

vidar · #1 (**permalink**) 02.03.2007, 12:13

Hallo zusammen!

Hab ein kleines Problem bei der Definition von einem Style für einen a - Tag. Im folgenden Code-Beispiel wird bekommt der "Right-Link" einen eigenen Style (rot, unterstrichen) über die Klasse "custStyle" zugewiesen. Trotzdem wird immer der im "#footer" allgemein definierte Style (schwarz, nicht unterstrichen) dargestellt.

Kann sich das jemand erklären? Bin dankbar für jeden Tipp!

Gruß, vidar

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
<title>Unbenannt</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<style>
a.custStyle, a.custStyle:link, a.custStyle:visited {
	color: #FF3300;
	text-decoration: underline;
	font-weight: normal;
}

a.custStyle:hover, a.custStyle:active {
	color: #FF3300;
	text-decoration: underline;
	font-weight: normal;
}


#footer a, #footer a:link, #footer a:visited {
	color: #000000;
	text-decoration: none;
	font-weight: normal;
}

#footer a:hover, #footer a:active {
	color: #000000;
	text-decoration: none;
	font-weight: normal;
}
</style>

</head>
<body>

<div id="footer">
	<div id="left">
		<a href="#">Left-Link</a>
	</div>
	
	<br /><br />
	
	<div id="right">
		<a href="#" class="custStyle">Right-Link</a>
	</div>
</div>

</body>
</html>

RoToRa · #2 (**permalink**) 02.03.2007, 12:20

Lies Dir in deiner Lieblings-CSS-Referenz den Kapitel über Spezifität durch. Eine CSS-Regel mit einer ID hat eine Höhere Spezifität (Priorität) als eines mit einer Klasse. In deinem Fall könntest du es so machen:

Code:

#footer a.custStyle, #footer a.custStyle:link, #footer a.custStyle:visited {
   ...
}

Außer du brauchst "custStyle" auch außerhalb von #footer, dann wäre eine andere Lösung nötig.

Robin

vidar · #3 (**permalink**) 02.03.2007, 12:22

Zitat:

Außer du brauchst "custStyle" auch außerhalb von #footer, dann wäre eine andere Lösung nötig.

Genau das ist das Problem: ich brauche "custStyle" auch außerhalb vom Footer... Eine andere Lösung ersichtlich?

vidar

RoToRa · #4 (**permalink**) 02.03.2007, 12:29

Nun das kommt auf die gesamte Struktur der Seite drauf an. Du müsstest entweder eine ID (oder mehrer IDs) finden, in der alle "custStyle" vorkommen, z.B.:

Code:

#content a.custStyle, #menu a.custStyle, #footer a.custStyle {
   ...
}

Oder wenn es ein z.B. umgreifendes Element gibt:

Code:

#wrapper a.custStyle {
   ...
}

Es gibt im Prinzip viele Lösungen, aber alle hängen von der "Gesamtsituation" ab.

Robin

vidar · #5 (**permalink**) 02.03.2007, 12:54

Zitat:

Oder wenn es ein z.B. umgreifendes Element gibt:

das ist die beste Lösung... habe alle Elemente in einem Container und innerhalb diesem wird nun einfach der Style definiert!

thx für deine Tipps!
gruß, vidar

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Ansicht
Linear-Darstellung Zur Hybrid-Darstellung wechseln Zur Baum-Darstellung wechseln

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Jquery Load Div Problem / Css Style wird nicht erkannt	mastaa	Javascript & Ajax	5	16.03.2011 17:50
IE6:Horizontales Menü wird unterschiedlich angezeigt:erst falsch, nach Reload korrekt	Ste	CSS	0	25.02.2009 13:46
Darstellungsprobleme im IE7 - FF, Google Chrome zeigen korrekt	webrise	CSS	6	05.09.2008 11:33
Style Sheet Reihenfolge	laborix	CSS	7	02.09.2007 16:23
CSS Style wird nicht übernommen...	masterbigjoe	(X)HTML	3	08.03.2007 09:48