Kindselektor bei Elternelement mit Klasse
Yadgar
- css
Hi(gh)!
Für mein Offline(!!!, dies nur als diskreten Hinweis an die Hüter der Orthodoxie...)-Tagebuch habe ich für eingerückte Zitate eine Absatz-Klasse p.quote eingeführt:
p.quote { font-style:italic; margin-left:20px }
Da ich die Absätze innerhalb eines solchen Zitats ebenfalls kursiv (aber relativ zum Elternelement nicht weiter eingerückt) haben will, versuchte ich mein Glück mit dem Kindkombinator:
p.quote > p { font-style:italic }
was leider überhaupt nicht funktionierte - der gesamte Zitatabsatz blieb unformatiert! Was mache ich falsch?
Bis bald im Khyberspace!
Yadgar
Hallo,
Hast du denn wirklich verschachtelte Absätze?
Zeig mal dein HTML.
Gruß
Kalk
Hi(gh)!
Hallo,
Hast du denn wirklich verschachtelte Absätze?
Zeig mal dein HTML.
Gegenwärtig sieht der Code so aus:
<p class="quote">
Sehr geehrte/r Inserent/in,<br>
<br>
Info vom Heimorgelspezialisten: Ihre Orgel heißt richtig Yamaha Electone FS-30 - eine ES-Serie hat es von Yamaha nie gegeben! Baujahr übrigens 1983!<br>
<br>
Kaufen und mitnehmen kann ich Ihre Orgel allerdings nicht, da hier schon eine ziemlich große Orgel (Technics SX-G5) steht und ich keinen Platz für eine Zweitorgel habe! Obwohl ich ja im Prinzip Heimorgelsammler bin...<br>
<br>
Mit freundlichen Grüßen
</p>
...und so sieht es im Browser auch korrekt aus - aber das ist natürlich die Dummenversion von verschachtelten Absätzen, eigentlich wollte ich etwas wie
<p class="quote">
<p>
...
</p>
</p>
Bis bald im Khyberspace!
Yadgar
Hallo
...und so sieht es im Browser auch korrekt aus - aber das ist natürlich die Dummenversion von verschachtelten Absätzen, eigentlich wollte ich etwas wie
<p class="quote"> <p> ... </p> </p>
Keine Absätze in Absätzen! Punkt. Um. Aus.
Wenn du ein mehrabsätziges Zitat ausgeben willst, brauchst du ein anderes Element als p
. blockquote
bietet sich an … ach, was sag' ich, drängt sich geradezu auf. Auch für aus einem (Ab)-Satz bestehende Zitate ist es das richtige Element.
<blockquote class="quote">
<p>
...
</p>
[<p>
...
</p>]
</blockquote>
Für Zitate als Teil eines (Ab)-Satzes wäre q
das zutreffende Element.
Tschö, Auge
@@Auge
… ach, was sag' ich, drängt sich geradezu auf.
Bei dieser Wiki-Seite drängen sich mehr Fragen auf als beantwortet werden.
Was soll das Beispiel „Zitat und Adresse“? Was hat address
auf einer Wiki-Seite zu suchen, bei der es um blockquote
geht? Was hat beides miteinander zu tun?
LLAP 🖖
Hallo,
p.quote { font-style:italic; margin-left:20px }
das sieht aus wie p in p. Hast du das wirklich? So weit ich weiß, ist das nicht erlaubt.
Oder suchst du den Nachbarkombinator oder den Geschwisterkombinator (siehe https://wiki.selfhtml.org/wiki/CSS/Selektoren/Kombinator)?
Gruß
Jürgen
Hallo JürgenB,
So weit ich weiß, ist das nicht erlaubt.
Genau das ist auch der Punkt. CSS wirkt auf das DOM, nicht auf den HTML Source, und der Browser beendet ein p Element, wenn ein neues beginnt. Sie schachteln sich nicht. Das sieht man im DOM Inspektor des Browsers.
Yadgar, verwende an Stelle des äußeren p z.B. ein blockquote Element, das wäre semantisch korrekt und es erlaubt flow content (fließenden Inhalt), wozu auch p gehört. blockquote rückt schon per Defaultstylesheet des Browsers ein, bzw. das kannst man auch selbst genauer spezifizieren:
blockquote {
font-style: italic;
margin-left: 1.5em;
}
<blockquote>
<p>Sehr geehrte/r Inserent/in,</p>
<p>Info vom Heimorgelspezialisten: Ihre Orgel heißt richtig
Yamaha Electone FS-30 - eine ES-Serie hat es von Yamaha
nie gegeben! Baujahr übrigens 1983!</p>
<p>Kaufen ud mitnehmen kann ich Ihre Orgel allerdings nicht,
da hier schon eine ziemlich große Orgel (Technics SX-G5)
steht und ich keinen Platz für eine Zweitorgel habe! Obwohl
ich ja im Prinzip Heimorgelsammler bin...</p>
<p>Mit freundlichen Grüßen</p>
</blockquote>
Rolf
@@Rolf B
blockquote rückt schon per Defaultstylesheet des Browsers ein
Und das auch rechts. Wenn man das nicht will, muss man was anderes (0) angeben.
LLAP 🖖
@@Yadgar
Für mein Offline(!!!, dies nur als diskreten Hinweis an die Hüter der Orthodoxie...)-Tagebuch habe ich für eingerückte Zitate eine Absatz-Klasse p.quote eingeführt:
blockquote
wäre das passende Element gewesen.
Da ich die Absätze innerhalb eines solchen Zitats
Solche gibt es nicht; p
-Elemente kann man nicht verschachteln.
<p class="zitat">
<p>Was du nicht sagst!</p>
</p>
führt zu folgendem DOM (bzw. was das Entwicklertool als solches anzeigt):
<p class="zitat">
</p>
<p>Was du nicht sagst!</p>
<p></p>
versuchte ich mein Glück mit dem Kindkombinator:
p.quote > p { font-style:italic }
Da es kein p
in p
gibt, wirst du damit kein Glück haben.
LLAP 🖖
Hallo Gunnar,
ach menno, immer bin ich noch am Schreiben während Du schon postest 😉
Rolf
@@Rolf B
ach menno, immer bin ich noch am Schreiben während Du schon postest 😉
Wir aus Villariba sind halt fixer als ihr aus Villabajo.
LLAP 🖖
Hallo Rolf,
ach menno, immer bin ich noch am Schreiben während Du schon postest 😉
Mach dir nix draus: ich hab das Posting gerade erst gesehen und dachte auch „meh, das wollte ich auch schreiben“ 😉
Freundliche Grüße,
Christian Kruse
Hej Christian,
ach menno, immer bin ich noch am Schreiben während Du schon postest 😉
Mach dir nix draus: ich hab das Posting gerade erst gesehen und dachte auch „meh, das wollte ich auch schreiben“ 😉
Kannst du doch immer noch machen. 😂
Marc