CSS-эффект перехода делает изображение размытым / перемещает изображение на 1 пиксель в Chrome?

Когда div наведен, эффект перехода CSS перемещает div.

Проблема, как вы можете видеть в этом примере, заключается в том, что переход «translate» имеет ужасный побочный эффект: изображение в div перемещается на 1px вниз / вправо (и, возможно, немного изменяет размер?), Так что оно появляется снаружи. не в фокусе ...

Похоже, что сбой возникает все время, когда применяется эффект наведения, и из процесса проб и ошибок я могу с уверенностью сказать, что он возникает только тогда, когда переход с переводом перемещает div (тень от блока и непрозрачность также применяются, но не имеют значения для ошибка при удалении).

2-е РЕДАКТИРОВАНИЕ: На самом деле, проблема НЕ решена!

При создании JSFiddle для иллюстрации проблемы я наткнулся на интересное наблюдение. Проблема возникает только тогда, когда на странице есть полосы прокрутки. Таким образом, пример только с одним экземпляром div подходит, но как только добавляются идентичные div, и поэтому странице требуется полоса прокрутки, проблема снова возникает ...

Есть идеи?!

Ответы на вопрос(12)

Ваш ответ на вопрос