Наведение на ссылку вызывает background-size: cover; для смещения в Chrome

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

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

Веб-сайт находится здесь: http://tylerbritt.com/

Стиль такой:

body{
    text-align: center;
    margin: 0 auto;
    color: white;
    font: bold 80pt 'Economica', sans-serif;

    background: url(bg2.jpg) no-repeat  center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover; 
}

a {
    color: white;
    text-decoration: none;
    -webkit-transition: text-shadow 0.3s ease-out;
    -moz-transition: text-shadow 0.3s ease-out;
    -o-transition: text-shadow 0.3s ease-out;
    -ms-transition: text-shadow 0.3s ease-out;
    transition: text-shadow 0.3s ease-out;
}

  a:hover { 
        text-shadow: 0 0 6px #1c00f6;
    }

Мои проблемы очень похожи на: Сдвиг фона в Google Chrome при изменении непрозрачности при наведении; Совет jfriend00 был полезен, но моя проблема отличается, потому что это просто текстовая ссылка, а не изображение.

Я использую Chrome версии 19.0.1084.52. Проблема не существует в Safari. Мы будем очень признательны за любые советы.

6
задан Community 23 May 2017 в 11:56
поделиться