Gentlemen is just a stupid question, but I am at a dead end ....

Where does the paragraph go?

http://jsfiddle.net/aKakt/1/

HTML:

<p> <h1>Ошибка 404</h1> <h2>Страница не доступна</h2> </p> <div> <h1>Ошибка 404</h1> <h2>Страница не доступна</h2> </div>

CSS:

 p, div { border: 1px solid; }

    1 answer 1

    We read here:

    MDN <p>

    Permitted content Phrasing content .

    The link says:

    Elements belonging to this category are

    <abbr>, <audio>, <b>, <bdo>, <br>, <button>, <canvas>, <cite>, <code>, <command>, <datalist>, <dfn>, <em>, <embed>, <i>, <iframe>, <img>, <input>, <kbd>, <keygen>, <label>, <mark>, <math>, <meter>, <noscript>, <object>, <output>, <progress>, <q>, <ruby>, <samp>, <script>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <svg>, <textarea>, <time>, <var>, <video>, <wbr>

    and plain text (not only stars of white spaces).

    If only this condition is fulfilled:

     <a>, if it contains only phrasing content <area>, if it is a descendant of a <map> element <del>, if it contains only phrasing content <ins>, if it contains only phrasing content <link>, if the itemprop attribute is present <map>, if it contains only phrasing content <meta>, if the itemprop attribute is present

    speaking Russian, inside <p> can be only elements from the first list, and elements from the second with restrictions:

    1. <a><del><ins><link><map> - can contain only the elements of the first list, or recursively satisfying these three conditions
    2. <area> only if it is inside the map
    3. <meta> only if there is an itemprop attribute

    I hope clearly explained.

    • Yes, thanks, everything is very accessible, just wondering what the logic of these restrictions is? let's say it’s silly stupid to put block elements inside the lowercase, but then P is like a block? - ferrari
    • standard html this is explained, I broke a search line in the standard is describing. And if you really are interested in the reasons for such a standard, whirl on the w3c mailings (not w3school, namely on w3c) and if you cannot find an explanation, ask. (my bet is that it’s easier to parse / render it’s not always that such monsters fit into the room in the pockets of people) - zb '
    • Since I have such cases, I often use them: CSS: a {display: inline-block; } a img {display: block; } HTML: <a href="anylink.html"> <img src = "anypic.png" alt = "picture" /> </a> Do you think such constructions are correct? - ferrari
    • one
      I think yes. <a> should contain only Phrasing content. , <img> - Phrasing content. - zb '