Frage zu Selektoren – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self?srt=yes Frage zu Selektoren Mon, 18 Apr 22 04:52:37 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798499?srt=yes#m1798499 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798499?srt=yes#m1798499 <p>Hello,</p> <p>ich habe versucht, den Abstand zwischen h2 und p mittels Kindselektor einzustellen. Leider im FF 99.0 (64) keine Reaktion.</p> <p>Erst, nachdem ich für p generell margin und padding auf 0 gestellt hatte, wurde <code>h2>p</code> beachtet.</p> <p>Ist das Standard, dass irgendwelche Browser-Grundeinstellungen für bestimmte Elemente einfach weitergelten, obwohl man sie eigentlich durch CSS-Angaben überschrieben hat?</p> <p>Glück Auf<br> Tom vom Berg</p> <div class="signature">-- <br> Es gibt nichts Gutes, außer man tut es!<br> Das Leben selbst ist der Sinn. </div> Frage zu Selektoren Mon, 18 Apr 22 05:45:38 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798500?srt=yes#m1798500 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798500?srt=yes#m1798500 <p>Servus!</p> <blockquote> <p>Hello,</p> <p>ich habe versucht, den Abstand zwischen h2 und p mittels Kindselektor einzustellen. Leider im FF 99.0 (64) keine Reaktion.</p> </blockquote> <p>Innerhalb von Überschriften (siehe: <a href="https://wiki.selfhtml.org/wiki/HTML/Elemente/h2" rel="nofollow noopener noreferrer">HTML/Elemente/h2</a>) darfst Du nur Stil-Elemente (<em>phrasing content</em>) wie a, b, em, span und Klartext verwenden.</p> <p>In <a href="https://wiki.selfhtml.org/wiki/HTML/Kategorien_von_Elementen#Aussagen-Elemente" rel="nofollow noopener noreferrer">HTML/Kategorien_von_Elementen</a> hat Der-Dennis sie 2015 mit <em>Aussagen-Elemente</em> übersetzt.</p> <blockquote> <p>Erst, nachdem ich für p generell margin und padding auf 0 gestellt hatte, wurde <code>h2>p</code> beachtet.</p> </blockquote> <p>Nimm lieber ein span-Element!</p> <p>Herzliche Grüße</p> <p>Matthias Scharwies</p> <div class="signature">-- <br> Einfach mal was von der <a href="https://wiki.selfhtml.org/wiki/Kategorie:ToDo" rel="nofollow noopener noreferrer">ToDo-Liste</a> auf die Was-Solls-Liste setzen.“ </div> Frage zu Selektoren Mon, 18 Apr 22 06:01:55 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798501?srt=yes#m1798501 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798501?srt=yes#m1798501 <p>Hallo,</p> <blockquote> <p>..., obwohl man sie eigentlich durch CSS-Angaben überschrieben hat?</p> </blockquote> <p>Deine Deutung ist falsch, du hast nichts überschrieben.</p> <p>Entweder hat der Browser dein HTml angepasst, dann solltest du Matthias' Rat anwenden oder du interpretierst dein html falsch, dann benötigst du den Geschwisterselektor statt des Kindselektors.</p> <p>Gruß<br> Kalk</p> Frage zu Selektoren Mon, 18 Apr 22 06:42:58 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798502?srt=yes#m1798502 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798502?srt=yes#m1798502 <p>Moin,</p> <blockquote> <p>ich habe versucht, den Abstand zwischen h2 und p mittels Kindselektor einzustellen. Leider im FF 99.0 (64) keine Reaktion.</p> </blockquote> <p>das ist auch in Ordnung so.</p> <blockquote> <p>Erst, nachdem ich für p generell margin und padding auf 0 gestellt hatte, wurde <code>h2>p</code> beachtet.</p> </blockquote> <p>Sicher?</p> <blockquote> <p>Ist das Standard, dass irgendwelche Browser-Grundeinstellungen für bestimmte Elemente einfach weitergelten, obwohl man sie eigentlich durch CSS-Angaben überschrieben hat?</p> </blockquote> <p>Nein. Aber deine Beschreibung ist widersprüchlich. Du meinst vermutlich den Sibling Selector (also in deinem Beispiel h2+p), denn h2>p (Child Selector) würde ein p selektieren, das ein Kindelement von h2 ist. Das darf es aber nicht geben.</p> <p>Und bei aufeinanderfolgenden Elementen: Vorsicht Stolperfalle! Collapsing Margins!</p> <p>Einen schönen Tag noch<br>  Martin</p> <div class="signature">-- <br> Мир для України. </div> Frage zu Selektoren Mon, 18 Apr 22 06:55:23 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798503?srt=yes#m1798503 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798503?srt=yes#m1798503 <p>@@Tabellenkalk</p> <blockquote> <p>Entweder hat der Browser dein HTml angepasst, dann solltest du Matthias' Rat anwenden oder du interpretierst dein html falsch, dann benötigst du den Geschwisterselektor statt des Kindselektors.</p> </blockquote> <p>Es kann wohl nur letzteres der Fall sein.</p> <p>Wie ein Browser sich bei <code class="language-html bad"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h2</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h2</span><span class="token punctuation">></span></span></code> zu verhalten hat, ist in der <a href="https://html.spec.whatwg.org/multipage/parsing.html#parsing-main-inbody" rel="nofollow noopener noreferrer">HTML-Spec §13.2.6.4.7</a> genau festgelegt: im DOM ist <code>p</code> in <code>h2</code> geschachtelt.</p> <p>So verhält sich auch Firefox. Und damit wirkt auch die Regel <code class="language-css"><span class="token selector">h2 > p</span> <span class="token punctuation">{</span> <span class="token property">margin</span><span class="token punctuation">:</span> 0 <span class="token punctuation">}</span></code>, siehe <a href="https://codepen.io/gunnarbittersmann/pen/YzYdpwX" rel="noopener noreferrer">Codepen</a>.</p> <p>Das beschriebene Problem lässt sich nicht nachvollziehen, was nur den Schluss zulässt, dass das Problem falsch beschrieben ist.</p> <p><a href="/users/4179" class="mention registered-user" rel="noopener noreferrer">@TS</a> hat wohl <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h2</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h2</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span></code> im Mark-up und wundert sich, warum der Kindselektor <code>h2 > p</code> nicht greift, wenn <code>p</code> gar kein Kind von <code>h2</code> ist.</p> <p lang="uk"> Живіть довго і процвітайте</p> <div class="signature">-- <br> <em lang="en">When the power of love overcomes the love of power the world will know peace.</em><br> — Jimi Hendrix </div> Frage zu Selektoren Mon, 18 Apr 22 07:01:48 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798504?srt=yes#m1798504 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798504?srt=yes#m1798504 <p>@@Der Martin</p> <blockquote> <p>h2>p (Child Selector) würde ein p selektieren, das ein Kindelement von h2 ist. Das darf es aber nicht geben.</p> </blockquote> <p>Und wenn es das doch gibt, dann tut <code>h2>p</code> genau das, was von ihm erwartet wird: ein <code>p</code> zu selektieren, das ein Kindelement von <code>h2</code> ist.</p> <p>CSS interessiert sich nicht dafür, was in HTML erlaubt ist und was nicht. Relevant ist einzig das generierte DOM.</p> <p>S.a. <a href="https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798503#m1798503" rel="noopener noreferrer">anderes Posting</a></p> <p lang="uk"> Живіть довго і процвітайте</p> <div class="signature">-- <br> <em lang="en">When the power of love overcomes the love of power the world will know peace.</em><br> — Jimi Hendrix </div> Frage zu Selektoren Mon, 18 Apr 22 07:04:01 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798505?srt=yes#m1798505 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798505?srt=yes#m1798505 <p>Hello,</p> <blockquote> <p><a href="/users/4179" class="mention registered-user" rel="noopener noreferrer">@TS</a> hat wohl <code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>h1</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>h1</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span></code> im Mark-up und wundert sich, warum der Kindselektor <code>h1 > p</code> nicht greift, wenn <code>p</code> gar kein Kind von <code>h1</code> ist.</p> </blockquote> <p>Ach wie dumm! Genauso ist es. Also den Geschwister-Selector...</p> <p>Und es soll nur der direkt auf <code><h2></h2></code> folgende <p> im Abstand beeinflusst werden. Was musx ich da noch zusätzlich beachten?</p> <p>Glück Auf<br> Tom vom Berg</p> <div class="signature">-- <br> Es gibt nichts Gutes, außer man tut es!<br> Das Leben selbst ist der Sinn. </div> Frage zu Selektoren Mon, 18 Apr 22 07:13:35 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798506?srt=yes#m1798506 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798506?srt=yes#m1798506 <p>Hallo,</p> <blockquote> <p>He Also den Geschwister-Selector...</p> <p>Und es soll nur der direkt auf <code><h2></h2></code> folgende <p> im Abstand beeinflusst werden. Was musx ich da noch zusätzlich beachten?</p> </blockquote> <p>Dann ist es wohl der Nachbarselektor.</p> <p>Gruß<br> Kalk</p> Frage zu Selektoren Mon, 18 Apr 22 07:13:40 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798507?srt=yes#m1798507 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798507?srt=yes#m1798507 <p>@@TS</p> <blockquote> <p>Ach wie dumm! Genauso ist es. Also den Geschwister-Selector...</p> <p>Und es soll nur der direkt auf <code><h2></h2></code> folgende <p> im Abstand beeinflusst werden. Was musx ich da noch zusätzlich beachten?</p> </blockquote> <p>Dass du den <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_combinator" lang="en" rel="nofollow noopener noreferrer">adjacent sibling combinator</a> verwendest und nicht den <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_combinator" lang="en" rel="nofollow noopener noreferrer">general sibling combinator</a>.</p> <p lang="uk"> Живіть довго і процвітайте</p> <div class="signature">-- <br> <em lang="en">When the power of love overcomes the love of power the world will know peace.</em><br> — Jimi Hendrix </div> Frage zu Selektoren Mon, 18 Apr 22 07:23:50 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798508?srt=yes#m1798508 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798508?srt=yes#m1798508 <p>Hallo Gunnar,</p> <blockquote> <blockquote> <p>Also den Geschwister-Selector...</p> <p>Und es soll nur der direkt auf <code><h2></h2></code> folgende <p> im Abstand beeinflusst werden. Was musx ich da noch zusätzlich beachten?</p> </blockquote> <p>Dass du den <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_combinator" lang="en" rel="nofollow noopener noreferrer">adjacent sibling combinator</a> verwendest und nicht den <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_combinator" lang="en" rel="nofollow noopener noreferrer">general sibling combinator</a>.</p> </blockquote> <p>Einfacher wäre es, nur die h2 zu formatieren:</p> <pre><code class="block language-css"><span class="token selector">h2</span> <span class="token punctuation">{</span> <span class="token property">margin-bottom</span><span class="token punctuation">:</span> 9em<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> <p>Bis bald! Jonathan</p> <div class="signature">-- <br> "Es gibt Besserwisser, die niemals begreifen, dass man recht haben kann und trotzdem ein Idiot ist." </div> Frage zu Selektoren Mon, 18 Apr 22 07:25:33 Z https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798509?srt=yes#m1798509 https://forum.selfhtml.org/self/2022/apr/18/frage-zu-selektoren/1798509?srt=yes#m1798509 <p>@@Jonathan Harker</p> <blockquote> <p>Einfacher wäre es, nur die h2 zu formatieren:</p> <pre><code class="block language-css"><span class="token selector">h2</span> <span class="token punctuation">{</span> <span class="token property">margin-bottom</span><span class="token punctuation">:</span> 9em<span class="token punctuation">;</span> <span class="token punctuation">}</span> </code></pre> </blockquote> <p>Nein. Es geht nicht darum, den Abstand zu vergrößern. Er soll kleiner (<code>0</code>) gemacht werden.</p> <p lang="uk"> Живіть довго і процвітайте</p> <div class="signature">-- <br> <em lang="en">When the power of love overcomes the love of power the world will know peace.</em><br> — Jimi Hendrix </div>