Css background image position animates

Question

Я пытаюсь создать меню, в котором есть фоновые изображения, которые прилагаются: hover. У меня разные ссылки меню по размеру, поэтому я решил, что часть изображения будет выровнена слева от другого выровненного справа, и изображение центра, которое может растягиваться. Когда я их применяю, он работает, как мне нравится, кроме того, когда вы сначала наводите на него курсор, все изображение скользит вниз на несколько пикселей. У меня была такая же проблема, когда я использовал только одно фоновое изображение. У меня была такая же проблема при использовании фонового размера. Это происходит в Chrome, Firefox и т. Д. Окна 7.

li#menubg1 a:hover, ul li li#menubg1 a:hover { 
 
    background: url("D:\hoverleft.png") no-repeat left, url("D:\hoverright.png") no-repeat right, url("D:\hovermiddle.png") no-repeat center; 
 
    background-size: auto, auto, 100% 34px; 
 
}

Answer 1

transition: background-size 0s ease-in; 
 
    -moz-transition: background-size 0s ease-in; 
 
    -web-kit-transition: background-size 0s ease-in;

Я думаю, я нашел ответ на мой вопрос