Polecam! Jeżeli masz problem: Czy mogę umieścić element HTML A wewnątrz elementu B?

Question

Czy mogę dołączyć element HTML A do elementu B? Na przykład, czasami zapominasz, czy możesz wrzucić element <div> do elementu <p> , ponieważ oznacza to, że musisz zapamiętać, który element HTML możesz zamieścić w innym, a jedynym sposobem na naukę jest metoda prób i błędów, która może zająć dużo czasu.

Z pomocą przychodzi ciekawa strona: Can I include

Answer 1

Mam z tym narzędziem jeden, dość podstawowy problem: opiera się na specyfikacji HTML, a więc sprawdza wyłącznie poprawność syntaktyczną. A raczej nie z tym jest największy problem (od tego jest walidator), tylko z semantyką.

Dodatkowo to nie wyłapuje ciekawych smaczków, np. podany przykład div w p jest niemożliwy do stworzenia w rzeczywistym świecie. Akapit bowiem zamknie się przed divem:

<p><div></div></p>

<!--daje-->

<p></p>
<div></div>
<p></p>

 

Comments

Rzeczywiście w narzędziach developerskich tak się prezentuje układ blok w akapicie. W podglądzie źródła strony zamykający tag </p> jest prezentowany na czerwono, czyli jako nieprawidłowy (Firefox).

---

To wynika z tego, że akapit jest elementem, który jest interpretowany inaczej niż pozostałe i jest automatycznie zamykany po natrafieniu na szereg innych elementów. Jest to wprost ujęte w specyfikacji:

A p element's end tag can be omitted if the p element is immediately followed by an address, article, aside, blockquote, details, div, dl, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, main, menu, nav, ol, p, pre, section, table, or ul element, or if there is no more content in the parent element and the parent element is an HTML element that is not an a, audio, del, ins, map, noscript, or video element, or an autonomous custom element.

Prawdopodobnie wzięło się to stąd, że pierwotnie element p nie miał oznaczać akapitu, ale przerwę między akapitami i nie miał znacznika końcowego.