Should ol/ul be inside <p> or outside?

html

Solution

The short answer is that `ol` elements are not legally allowed inside `p` elements.

To see why, let's go to the spec! If you can get comfortable with the HTML spec, it will answer many of your questions and curiosities. You want to know if an `ol` can live inside a `p`. So…

4.5.1 The `p` element:

Categories: Flow content, Palpable content. Content model: Phrasing content.

4.5.5 The `ol` element:

Categories: Flow content. Content model: Zero or more li and script-supporting elements.

The first part says that `p` elements can only contain phrasing content (which are “inline” elements like `span` and `strong`).

The second part says `ol`s are flow content (“block” elements like `p` and `div`). So they can't be used inside a `p`.

`ol`s and other `flow content` can be used in in some other elements like `div`:

4.5.13 The `div` element:

Categories: Flow content, Palpable content. Content model: Flow content.

Problem

Which is standard compliant between these two? ``` <p>Text text text ... <ol> <li>First element</li> </ol> </p> <p> Other text text ... </p> ``` OR ``` <p> Text text text ... </p> <ol> <li>First element</li> </ol> <p> Other text text ... </p> ```

Original source

Related problems