Why does chrome sometimes fail to redraw the page when I expand the browser window?

Question

I'm currently working on a responsive design site prototype. So far so good, but for one really strange thing which I can only seem to reproduce in Chrome. When expanding the window, sometimes the browser seems to get trapped between states, showing duplicate elements, and two scrollbars - that is, until I click somewhere outside of the browser window, then everything gets redrawn and looks just fine. Screenshot:

I've tried a plethora of "tricks" to get chrome to "re-jig" the interface programmatically, such as changing the padding of the body element, modifying the scrollY position, and about 10 or so others, but nothing seems to do the trick. Does anyone have any experience with this? Any advice?

Answer 1

This looks like a bug in Chrome.

I searched Chromium bugs and found a few that are similar:

• Issue 516127: Rendering artifacts on osx when something moves above the browser (dock, other windows, etc)
• Issue 473933: Visual rendering issue
• Issue 476909: Page didn't redraw correctly
• Issue 245946: Content isn't layout correctly when resizing window

But actually none of them seems to describe your problem exactly. If you think so too, you can report your bug here.

Note that this might be as well an issue related to your old Mac OS version or even the graphics card.