O efeito de transição de CSS faz com que a imagem fique desfocada / mova a imagem 1px no Chrome?

Quando o div é passado, um efeito de transição CSS move o div.

O problema, como você pode ver no exemplo, é que a transição 'translate' tem o horrível efeito colateral de fazer a imagem no div se mover 1px para baixo / direita (e possivelmente redimensionar tão ligeiramente?) Para que apareça de lugar e fora de foco ...

A falha parece se aplicar durante todo o tempo em que o efeito de foco é aplicado e, a partir de um processo de tentativa e erro, posso dizer com segurança que só parece ocorrer quando a transição de translação move a div (sombra de caixa e opacidade também são aplicadas, mas não fazem diferença o erro quando removido).

2 EDIT: Na verdade, problema não resolvido!

Ao criar um JSFiddle para ilustrar o problema, me deparei com uma observação interessante. O problema só acontece quando a página tem barras de rolagem. Portanto, o exemplo com apenas uma instância da div é bom, mas depois que mais divs idênticas são adicionadas e a página requer uma barra de rolagem, o problema ataca novamente ...

Alguma ideia?!

questionAnswers(12)

yourAnswerToTheQuestion