Wrong element scrollWidth after css transform translate3d

Question

Parent element has property overflow: scroll . When I move children element by jquery css property transform, for the first time parent changes his property scrollWidth . But next manipulations on transform don't change scrollWidth of the parent.

This issue actual for Chrome browser and Android mobile browser.

JSFiddle

Update: For my case helps to fallback from transform: translate3d to transform: translate but question still actual.

Answer 1

I opened it using firefox and has the same behavior.. I think transation doesn't change the default position.. You can prove it using consoleLog('pos: ' + $two.css("left")); and don't forget to add left: 0px in your css..

To change the position of a div maybe you can use jquery animate here ...