michalc2 minutes ago
The GOV.UK Design System summary list component is a description list https://design-system.service.gov.uk/components/summary-list...
And... it also uses the wrapper div for styling
cloud-oak11 minutes ago
The final example of the DnD statt sheet makes me think whether it's legal to nest <dl>s?
I.e. can we do
<dl>
<dt>Actions</dt>
<dd><dl>...</dl></dd>
</dl>captn3m022 minutes ago
> Prior to HTML5, this was called a definition list. This is because the <dl> was originally only intended to represent glossaries of terms and their definitions.
TIL I’ve been naming it wrong for a decade.
phyzix576129 minutes ago
I'm curious if the spec actually says you can only wrap it with a div because I like to do semantic html and name my elements specific to my domain.
wonger_22 minutes ago
Seems like div is the only recommended wrapper element:
https://html.spec.whatwg.org/multipage/grouping-content.html...
https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/...
EDIT everyone replied at once lol. I'm surprised too about div.
Also, screen reader support: https://a11ysupport.io/tech/html/dl_element
philo2326 minutes ago
Yep, I was a little surprised about that too, seem like it is valid though https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/...
[deleted]25 minutes agocollapsed
Tomte25 minutes ago
rickstanley30 minutes ago
I've used this a good amount of times, when I coded in front end projects. The first time gave me that satisfying feeling of using the right tool for the job, like completing a puzzle of HTML semantics. I remember JAWS not announcing it correctly in 2018, not sure if it's better now.
wizzwizz417 minutes ago
When I checked in 2024 or 2025, Windows Narrator announced it differently in Chrome, Firefox, Edge (Chromium mode) and Edge (IE mode), and none of them worked how I would expect them to. Adrian Roselli's verdict (https://adrianroselli.com/2025/01/updated-brief-note-on-desc...):
> Description list support continues to be generally good (with VoiceOver still the outlier), even if you may not like how it is supported.
You shouldn't try to fix this kind of thing by mangling the HTML, since (1) users tend to be used to their screen reader's quirks, and (2) in situations like these, making it juuuust right in one screen reader is likely to make it incomprehensible in another. But it is important to be aware of these quirks, so you don't accidentally design an interface that relies on less-quirky behaviour.
jdw649 minutes ago
blog looks beautiful. I really wish I had this kind of talent for frontend.
[deleted]32 minutes agocollapsed
Telemakhos31 minutes ago
I was a bit surprised to see nested <div>s given as some sort of precursor pattern, when <dl> was part of HTML before 2.0 back in the days of table layout.
turtleyachtan hour ago
Hoped to see CSS for the alternative, where <div> is not nested inside the <dl>. Too used to thinking of div as "layout containers."
MattRix16 minutes ago
Good title