html - Chrome redraw issue -

i'm getting odd redraw issue in chrome:

see broken right side? div single background img.

html

<div id="resultssortfilter>   <!-- ... --> </div> 

css

#resultssortfilter {     float: left;     width: 712px;     height: 109px;     margin: 7px 0 0 8px;     background: url('../images/search_sortfilter_bg.png') no-repeat; } 

• no issues in other browser
• happens on newer versions only, blocked update prevent causing issues internally.
• seems triggered scrolling , down before rendering finished.
• same issues on multiple sites

has else seen this? knows what's causing or chrome intends it?

chrome version 26.0.1410.64 m

update

the issue on windows , mac os. in fact seems worse on mac.

i might have pinned down further. error on page contains lots of large images. i'm wondering if has size of data chrome has download?

this appears make issue go away (not going call fix):

"it might newer version of chrome not gpu. have had issues similar yours , have solved them turning off compositing , 3d acceleration features.

type chrome://flags address bar , set following items:

• gpu compositing on pages: disabled (three options in drop-down.)
• disable accelerated 2d canvas: enable (click link says 'enable', box turn white.)
• disable accelerated css animations: enable (like above, item turn white.)
• then click button shows @ bottom of page relaunch restart chrome , test if worked."

from https://askubuntu.com/questions/167140/google-chrome-with-strange-behavior

update

the issue seems gone in later versions of chrome.

chrome getting buggier. worth trying forcing gpu hardware acceleration on element.

add css force hardware acceleration:

-webkit-transform: translate3d(0, 0, 0);