Browsers scrollbar is under my fixed div

Question

i have a fixed header with 100% width.

#header {
background: #2e2e2e;
width: 100%;
z-index: 999;
position: fixed;
}

browsers scrollbar is u

Answer 1

The issue isn't with overflow-x on the body tag. It's because of overflow-x andoverflow-y on the html tag. Once I removed this from the HTML tag, I could put whatever overflow I wanted on my body.

This happens when:

• overflow-x is set to either auto, hidden, overflow, or scroll
• overflow-y is set to either auto, hidden, -webkit-paged-x, or -webkit-paged-y

It doesn't have to be an explicit call to overflow-x or overflow-y, as overflow sets both of them.

I'm on Chrome 67 using Windows 10.