Используя 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. Мы будем очень признательны за любые советы.