Semantic HTML markup of DT/DD groups

Sometimes, it is needed to apply styles to each group of DT/DD elements integrally.

But wrapping DT and DD elements in a common container like DIV is disallowed by the HTML specification: DL is the only valid parent element of these elements.

In such cases, each such group should be put into its own separate DL element, and to keep adjacent groups belonging to a single semantic sequence, each such DL may be put into a LI element of a regular unordered list UL:

<ul>
    <li><dl>
        <dt>Foo</dt>
        <dd>Bar</dd>
    </dl></li>

    <li><dl>
        <dt>Lorem</dt>
        <dd>Ipsum</dd>
    </dl></li>
</ul>

Update: starting from , the HTML spec allows wrapping DT/DD in DIV, but for now, it is allowed to use not more than one nested DIV, so usefulness of the feature in practice is very limited and the approach described here is still relevant.