I can use header tag and place navbar into it, but in this case I’ll have extra div tag (navbar) header > div.navbar > container, is it possible to avoid it and change navbar’s tag from div to header?
What does it suppose to mean?
To better understand HTML elements
Looks like you didn’t understand the question
Did you read MDN documentation? it looks like you still do not understand <header> tag. Are you talking about class header?
I’m talking about header with class “header”, but it doesn’t matter in this case at all. I’m using tag header to create the global site header (banner), what’s the problem here?
From your HTML strucure text header > div.navbar > container looks like this.
<header>
<div class="header">
<div class="container">
</div>
</div>
</header>
If you you are asking to replace <div> tag with <header> tag you still didn’t read the documentation on what is <header> tag for, how it should be used and what is not allowed. That is why I have posted documentation where you can find your answer.
Summary
The
<header>HTML element represents introductory content, typically a group of introductory or navigational aids. It may contain some heading elements but also a logo, a search form, an author name, and other elements.
What this means is that <header> is a wrapper for introductory content so the crawler will understand better page content structure. This means that header tag has a specific meaning in HTML structure.
in Technical summary you will find this
Any element that accepts flow content. Note that a
<header>element must not be a descendant of an<address>,<footer>or another<header>element.
this mean that <header> can’t be placed inside <header>
Hope this will give you an answer to your question.
Good luck
Thanks for the detailed answer, but as I suspected - you didn’t understand the question, I obviously don’t want to put one ‘header’ inside other ‘header’, I just wanted to avoid extra nesting and change navbar’s wrapping tag from ‘div’ to ‘header’, in this case, of course, I would not need two headers, but there is no such option for navbar in webflow, you can’t change tag
at the same time you can change tag for default container element
The navbar itself has enough nesting to implement global site header, but because it’s ‘div’ tag by default and you cant’ change it - I had to wrap navbar element with ‘header’ tag
I’m talking about ‘Navbar’, not about ‘Nav menu’
WF Navbar component has predefined functionality that is tight to the system that’s why doesn’t offer to make changes to this wrapper to protect users from mistakes that may brake this component’s functionality. If HTML structure of this component doesn’t satisfy your expectation you can always build your own component from scratch that fulfill your needs.