Joel Hoelting
Joel Hoelting

Reputation: 1992

Why is my header overlapping my navbar?

I'm building a basic blog and my header keeps extending up behind my navbar. The navbar has a fixed position and a z-index that is higher than the header. I can't figure out why the top of the header/banner image is extending behind the navbar. I am including a picture of the issue highlighted in FF dev tools and you can see my site directly here if you'd like. Any help/input greatly appreciated.

enter image description here

Upvotes: 2

Views: 1934

Answers (1)

Frutis
Frutis

Reputation: 489

Edit: as shiva said fixed doesnt take any space, so just add some more margin.

header {
    margin: 89px 0 0;  // update margin
}

And update your media screen

@media only screen and (max-width: 500px){
header {
margin: 80px 0 0;
}
}

Upvotes: 1

Related Questions