Putting tags inside <li> tags

In xhtml/html am I allowed to put <p>, <h2> etc. tags inside <li></li> tags? I know this won’t actually break the page, but is it semantically acceptable.

The answer may seem like an obvious “yes it’s ok” but recently I was surprised to find out that putting text within a <blockquote> without also putting it in <p> tags is not allowed, so there are some pretty strict nesting rules around.

Cheers for any advice


well, quoting the dtd for xhtml strict:

<!ENTITY % block
“p | %heading; | div | %lists; | %blocktext; | fieldset | table”>

<!ENTITY % Block “(%block; | form | %misc;)*”>

<!-- %Flow; mixes block and inline and is used for list items etc. –>
<!ENTITY % Flow “(#PCDATA | %block; | form | %inline; | %misc;)*”>

So yes you could do so, and as %block; expands to %blocktext%, you could technically shove <hr>'s in there too (not sure why, seems kind of weird).

As for whether or not it’s semantically correct is a different story. For li’s to be li’s, they need to be a list of something (hence why you might see a lot of menus done as li’s and css’ed to look pretty, because menus are a list of links).

It’s perfectly all right to use those elements within a list item.

If you start mixing inline-level and block-level elements, then it’s semantically doubtful, though. That applies both within a single list item and within the list as a whole.

In other words, if you have a block-level element as a child of an li element, then all children of that li – and all sibling li elements – should be block-level.