1. CSS für Dummies; 2. IE-Kotze

[zeckensack]

1.
Vorab: SelfHTML habe ich selbstverständlich schon halb auswendig gelernt, aber es will mir nichts nützen. Es steht da einfach nicht.

Wie spezifiziere ich CSS-Attribute für verschachtelte Elemente?

Also angenommen ich habe dieses Stylesheet:.penixx { color:#777; }Und weiterhin angenommen ich habe HTML dieser Art:<p class="penixx">Ich will euch <a href="kleister.htm">linken</a>.</p>

Wie kann ich nun den Link innerhalb der Klasse penixx beeinflussen, sodass der Link in obigem Absatz gestylt wird, aber nicht Links innerhalb anderer Klassen (zB im Body)?
#penixx.a?
.penixx.a?
a.penixx?
penixx:a?

Alles was ich bisher versuchte war falsch :)
Bzw es passierte rein garnichts im Browser.

2.
CSS:body { color:#000; background-color:#FFF; }
.navleft { color:#000; background-color:#B0F0B0; width:150px;
font-weight:bold; }

<table cellpadding="5px">
<colgroup span="2"><col><col></colgroup>
<tr><td class="navleft" valign="top">

<p>
<a href="http://validator.w3.org/check?uri=referer">
<img src="valid-html401.png"
alt="Valid HTML 4.01 Transitional" height="31" width="88"></a>
</p></td>
</tr>
</table>Schön simpel, gell? Dachte ich auch :)
Der IE 6 scheint aber in diesem Fall der Meinung zu sein, das Bild einem Link entsprechend dekorieren zu müssen. Dh er zeichnet einen Rahmen drum, die Farbe entspricht der Link-Farbe (und seit ich da mal draufgedrückt habe ist es die Farbe eines bereits besuchten Links).

Siehe Anhang.
Oben Opera 8.53, unten der IE6.
Wie kriege ich diesen doofen Rahmen weg?

[Nase]

1. .penixx a:link, .penixx a:visited, .penixx a:hover, .penixx a:active
2. <img src="..." border="0">

[ravage]

http://www.css4you.de ist für eigentlich alle Fragen rund um CSS zu gebrauchen. In diesem Fall musste ich aber etwas suchen, um das gewünschte zu finden...

http://www.css4you.de/wscss/css04.html

Ich hab irgendwie in Erinnerung, dass das damals besser/ausführlicher erklärt war.

[/dev/NULL]

1: wie schon gesagt
.penixx a {
} sollte dein freund sein, aber auch
p.penixx a {
}sollte genauso gehen. die Pseudoattribute wie von Nase beschrieben
2: z.B.
p a img{
border:none;
}

[MadMan2k]

dürfte für dich ganz interesant sein:
http://www.w3schools.com/css/css_syntax.asp

[zeckensack]

Danke. Funzt nun wie gewünscht :)
Zu #1, ich hatte mir irgendwie das Gehirn verknotet nachdem ich die Beispiel da gelesen hatte:
http://de.selfhtml.org/css/formate/kaskade.htm

Ich hätte wohl etwas mehr "out of the box" denken sollen ;(

Ist #2 nicht streng genommen ein Bug im IE? :|

[Nase]

Ist #2 nicht streng genommen ein Bug im IE? :|
Ich kenn jetzt gerade nicht die Richtlinie, wie sind verlinkte Bilder verhalten sollen, aber dadurch, dass um so ein Bild ein Rahmen gemalt wird, wird dieses ja erst als Link wahrnehmbar. Von daher würde ich dieses Verhalten nicht als "Bug" beschreiben. Vor allem weil das schon immer so war und auch der Firefox ein gleiches Verhalten an den Tag legt. Seltsam kommt es mir allerdings vor, dass Opera den Rahmen eben gerade nicht anzeigt. Mal nachforschen ...

Edit:

Das W3C (http://www.w3.org/TR/html401/struct/objects.html#idx-border) sagt folgendes dazu: An image or object may be surrounded by a border (e.g., when a border is specified by the user or when the image is the content of an A element).Heißt für mich: Ein Bild kann oder kann nicht von einem Rahmen umfasst werden, wenn das Bild Inhalt eines Links ist. Demnach ist sowohl das Verhalten vom IE als auch von Opera richtig.

[TheRealTentacle]

2. <img src="..." border="0">

hehe, wenn du dass machst, hast du die Grafik nicht verdient ^^.

Keine ahnung, ob das nach Standard ist, aber ich hab das gemacht:

// CSS
img
{
border: 0px;
}

[Nase]

hehe, wenn du dass machst, hast du die Grafik nicht verdient ^^.

Keine ahnung, ob das nach Standard ist, aber ich hab das gemacht:

// CSS
img
{
border: 0px;
}
Wenn sich die Frage auf die Seite bezogen hat, die zeckensack in einem anderen Thread verlinkte, dann ist border="0" durchaus richtig. Auch wenn es als deprecated eingestuft ist, ist es bei HTML 4.01 Transitional noch durchaus verwendbar. Deine CSS-Lösung ist selbstverständlich richtig, wurde aber auch schon vorher gepostet.