position:fixed not working in Google Chrome

Question

I am having some trouble with a 'fixed' element in Google Chrome. The element behaves as it should in other major browsers.

Here is the CSS:

#element { 
    position: fixed; 
    bottom: 0px; 
    width: 100%; 
    height: 50px; 
    z-index: 10;
}

The issue is, when the page loads, the element is fixed at the bottom of the viewport, as it should be. Upon scrolling, it remains at the same spot where it was when the page loaded - it doesn't stay fixed to the bottom of the screen.

Answer 1

try adding the following code to your element:

-webkit-transform: translateZ(0);