Problem: Weitere Möglichkeiten für verschachtelte HTML-Elemente

[steffen]

Hallo Forumleser,

ich habe eine kleine Verständnisfrage.

Es dreht sich generell um dieses Beispiel:
http://de.selfhtml.org/css/formate/anzeige/verschachtelt2.htm

konkret um: div + p { margin-top:5em; }

Wenn ich jetzt jedoch in der Tabelle den ersten vorkommenden p Tag formatieren will, würde ich es Verständnismäßig so umschreiben:

td + p { margin-top:5em; }

leider funktioniert das ganze nicht.

Oder anderes Beispiel möchte von einer Tabelle nur jeweils die erste Spalte formatieren wäre doch logischerweise:

tr + td { color: #000000 }

Klappt leider auch nicht.

Kann mir jemand sagen, wobei mein Fehler liegt?

mfg Steffen

[suit]

konkret um: div + p { margin-top:5em; }

• ist der Adjacent sibling selector, also für direkt folgende Geschwister.

div + p selektiert also bei folgendem Code das p-Element mit Inhalt "bar" <div><p>foo</p></div><p>bar</p>

Jenes mit dem Inhalt foo würde man mit "div p" oder genauer "div > p" selektieren.

td + p { margin-top:5em; }

Das gibt es in HTML nicht weil ein td-Element kein p-Element als Geschwister-Element haben kann.

Wenn ich jetzt jedoch in der Tabelle den ersten vorkommenden p Tag formatieren will [...]

Brauchst du den Kindselektor ">" (oder Nachfahrenselektor " ") und die http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#first_line_letter_child@title=first-child-Pseudoklasse

[steffen]

Hallo suit,

Wenn ich jetzt jedoch in der Tabelle den ersten vorkommenden p Tag formatieren will [...]

Brauchst du den Kindselektor ">" (oder Nachfahrenselektor " ") und die http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#first_line_letter_child@title=first-child-Pseudoklasse

Danke für den Hinweis :) Klappt bestens und wieder etwas dazu gelernt ;)

Schönen Abend euch 2 Helfern

[Beat]

Es dreht sich generell um dieses Beispiel:
http://de.selfhtml.org/css/formate/anzeige/verschachtelt2.htm

konkret um: div + p { margin-top:5em; }

Der + Selektor ist der Sybling-Selector

Wenn ich jetzt jedoch in der Tabelle den ersten vorkommenden p Tag formatieren will, würde ich es Verständnismäßig so umschreiben:

td + p { margin-top:5em; }

Und dieser Selektor liesse auf eine ungültige HTML Syntax schiessen.
Denn <td> kann nur <td> oder <th> als Sybling haben.

Du suchst den Nachfahrenselektor, dessen Schreibweise schlicht SPACE ist.
 also

td p { margin-top:5em; }

leider funktioniert das ganze nicht.

Versuchs nochmal

mfg Beat