CODEWITHSUNDEEP
htmlsemantic-markup
Ky -
Ky -

Reputation: 32093

Does a <header> have to be at the top of an element?

I have a <nav> element where its title is wrapped in a <header>. However, this <header> is the last element in the <nav>. Is this a good practice?

I looked at the W3C's definition of <header>, and it has this to say:

The header element represents introductory content for its nearest ancestor sectioning content or sectioning root element. A header typically contains a group of introductory or navigational aids.

When the nearest ancestor sectioning content or sectioning root element is the body element, then it applies to the whole page.

This doesn't explicitly say where in its nearest ancestor it should be placed, but implies it should be the first (or topmost) element.

Here's a screenshot of my current mockup:

A navigational element stuck to the top of the webpage, with the title at the bottom

Note that this is not the final design and the element is position: fixed to the top of the viewport

Upvotes: 0

Views: 520

Answers (1)

lukeocom
lukeocom

Reputation: 3243

If you take a look at the standard it doesn't say you cant do this. It only says the header element cant be a decendant of an address or footer element. So go for it.

header - http://www.w3.org/TR/html-markup/header.html

nav - http://www.w3.org/TR/html-markup/nav.html

Generally speaking it would make sense for the nav element to be a child of the header element, or for the two to be separate.

Upvotes: 1

Related Questions