Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Question about Definition Lists and Navigation

Is there any reason not to use Definition lists to build navigation?

Then you wouldn't have to turn the text-decoration to none...

4 Answers

Hi Shams,

The reason we have to use text-decoration: none; is because we are using the <a> element to create links so that we can navigate to other parts of our site. By default they have an underline.

If you use a description list instead of a <ul> you're still going to have to put links in there somewhere and so you won't avoid the css you're trying to avoid.

You should never trade more semantic markup for less semantic markup in an attempt to reduce the css.

A navigation is a list of links and so it makes sense to use an unordered list.

This is taken from http://www.w3.org/TR/html5/grouping-content.html#the-dl-element -
"Name-value groups may be terms and definitions, metadata topics and values, questions and answers, or any other groups of name-value data."

A navigation doesn't fit into this name-value grouping that a <dl> would be used for.

Kenneth Love
STAFF
Kenneth Love
Treehouse Guest Teacher

Definition lists have a semantic meaning, which is that the <dd> definition defines the <dt> term. That's not true of navigation items, so it's less precise to use them.

You can definitely do it with the dl element, though semantically, it doesn't make much sense. In HTML 4.01, the <dl> tag defines a definition list. In HTML 5, the <dl> tag defines a description list. But you can do it, whether using both dt and dd tags or just one of them. Look at this pen

Nice, I get it now. Thanks guys.