Empty UL inside LI element
html, html-lists, standards
Solution
`<ul>` is not a valid self-closing tag, so browsers may treat it as though it has not been closed properly. You should always use a closing `</ul>` tag.
For a list of valid self-closing tags, see:
What are all the valid self-closing elements in XHTML (as implemented by the major browsers)?
Problem
Can anyone explain me why `<ul>` elementa cannot be empty? And why this HTML: ``` <ul> <li class="header"> <a href="#">Work</a> <ul/> </li> <li class="header"> <a href="#">New</a> <ul/> </li> <li class="header"> <a href="#">Ungrouped</a> <ul/> </li> <li class="header"> <a href="#">Offline</a> <ul/> </li> </ul> ``` is rendered like this: - Work - New - Ungrouped - Offline