 <p>I encountered a similar problem. As well as being fixed, one of the inside elements had <code>transform:rotate</code> 90 deg and had a hover effect that changed its position slightly (pulled out from the side of the screen). The background color of this element and its sibling were the same, and both would flicker randomly when elements on the page were changed / rendered.</p> <p>I finally found a combination of styles that stopped the background colour flickering altogether.</p> <p>I added the following to the parent element from here: <a href="http://stackoverflow.com/a/27863860/6260201">http://stackoverflow.com/a/27863860/6260201</a> </p> <pre><code>-webkit-transform:translate3d(0,0,0); -webkit-transform-style: preserve-3d; </code></pre> <p>That stopped the flickering of the transformed/sliding element.</p> <p>And I added the following to the remaining element from here: <a href="http://stackoverflow.com/a/19817217/6260201">http://stackoverflow.com/a/19817217/6260201</a></p> <pre><code>-webkit-backface-visibility: hidden; </code></pre> <p>This then stopped the flickering of the background colour for the sibling element.</p>