Is an unordered list element allowed inside a description details element?

user_6885008 0
Viewed 417

Can a dd element contain a ul element? Like this:

<dl>
  <dt>Lorem</dt>
  <dd>Sed lectus</dd>
  <dt>Vestibulum</dt>
  <dd>
    <ul>
      <li>viverra nec</li>
      <li>blandit vel</li>
      <li>egestas et</li>
    </ul>
  </dd>
  <dt>Suspendisse</dt>
  <dd>Nulla quam</dd>
</dl>

semantic-markup html
1 Answers

Yes, it is valid for a <dd> to contain a <ul>. According to the HTML Spec, <dd> elements should contain flow content. Unordered lists are considered flow content.

However, if each of the items in your example are alternate descriptions for the proceeding <dt> term, they should not be marked up in an unordered list and should instead be marked up using a series of <dd> elements.

For instance, the following is valid HTML, but semantically incorrect—because it implies that the entire list is a singular description for the term.

<dl>
  <dt>Firefox</dt>
  <dd>
    <ul>
      <li>A free, open source, cross-platform, graphical web browser developed by the Mozilla Corporation and hundreds of volunteers.</li>
      <li>The Red Panda also known as the Lesser Panda, Wah, Bear Cat or Firefox, is a mostly herbivorous mammal, slightly larger than a domestic cat (60 cm long).</li>
    </ul>
  </dd>
</dl>

The valid and semantically correct way to mark up this content is:

<dl>
  <dt>Firefox</dt>
  <dd>A free, open source, cross-platform, graphical web browser developed by the Mozilla Corporation and hundreds of volunteers.</dd>
  <dd>The Red Panda also known as the Lesser Panda, Wah, Bear Cat or Firefox, is a mostly herbivorous mammal, slightly larger than a domestic cat (60 cm long).</dd>
</dl>
user_53517210
Related