We most often use lists for semantic structure (like in navigation or forms) and
usually don’t want to display them as standard lists. It’s simpler to reset lists
globally in CSS and only display them as lists in text when needed with the
mzp-u-list-styled
class.
<ol class="mzp-u-list-styled">
<li>Ordered list item</li>
<li>Ordered list item
<ol class="mzp-u-list-styled">
<li>Nested ordered list</li>
</ol>
</li>
</ol>
<ul class="mzp-u-list-styled">
<li>Unordered list item</li>
<li>Unordered list item
<ul class="mzp-u-list-styled">
<li>Nested unordered list</li>
</ul>
</li>
</ul>
<dl class="mzp-u-list-styled">
<dt>Definition term</dt>
<dd>Definition text</dd>
<dt>Definition term</dt>
<dd>Definition text
<ul class="mzp-u-list-styled">
<li>Nested list</li>
</ul>
</dd>
<dt>Definition term</dt>
<dd>Definition text</dd>
<dd>Definition text</dd>
</dl>