Drupal site menu overlay stuck in Chrome Browser when scrolling down I noticed a strange behavior in my drupal Portal when using Chrome. There is an overlay at the top of the page. In Chrome, that overlay gets “stuck” on the page and you can’t easily get rid of it, and it starts constantly flickering. If I refresh its fine and when I scroll down the problem appears again.

Any help or suggestions are appreciated. Thank you.

Please find the attached screenshot here:



enter code here


.fixed#header {
    position: fixed;
    top: 0;
    left: 0;
    padding: 18px 0;
    width: 100%;
    background-color: #fff;
    background-color: rgba(255,255,255,.95);
    -webkit-box-shadow: 0 2px 3px rgba(0,0,0,.2);
    -moz-box-shadow: 0 2px 3px rgba(0,0,0,.2);
    box-shadow: 0 2px 3px rgba(0,0,0,.2);
    transform: translateZ(0);
}
style.css?onmqdt:859

header {

z-index: 99;
padding-top: 40px;
background-color: #fff;


}
Hard to say without being able to inspect it, the z-index on #header won't work unless position is set to something other than static (the default value).

Try setting #header to be position: relative; or position: absolute; whichever is more appropriate and see if that helps, or at least helps narrow down the problem.