2013-09-20 3 views
13

У меня проблема с Safari на iOS7. Проблема в том, чтобы иметь спрайты для сетчатки, так что Safari на iOS7 и размер фона (я так думаю). Он отлично работает на Chrome на iOS7, но Safari этого не делает. Код, который используется является:Safari на iO7 Проблема с CSS размером фона

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 2dppx) { 

    footer ul.social li a { background-size: 48px 144px; } 
    footer ul.social li a.fb { background: url(../images/socialx2.png) 0 0 no-repeat; } 
    footer ul.social li a.in { background: url(../images/socialx2.png) 0 -48px no-repeat; } 
    footer ul.social li a.tw { background: url(../images/socialx2.png) 0 -96px no-repeat; } 

} 

Вот образ того, как он выглядит на сафари под IOS7

screen capture

+0

Я только что спросил у клиента. У меня нет ios7 для игры, но мне кажется, что размер фона не работает на меня. –

+0

Да, вот в чем причина. Он не работает ни для спрайта, ни для спрайта. Такой позор – Ayreonaut

ответ

22

На сафари/iOS7, фон-размера сброшена при использовании свойства фона , Вам необходимо указать background-свойство после вашего фона:

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 2dppx) { 
    footer ul.social li a.fb { background: url(../images/socialx2.png) 0 0 no-repeat; background-size: 48px 144px; } 
    footer ul.social li a.in { background: url(../images/socialx2.png) 0 -48px no-repeat; background-size: 48px 144px; } 
    footer ul.social li a.tw { background: url(../images/socialx2.png) 0 -96px no-repeat; background-size: 48px 144px; } 
} 
+0

Thanx man this help! – Ayreonaut

+0

большое спасибо! спас меня от серьезной головной боли – marcgg

+0

Большое спасибо за это. Интересно, почему мой css больше не работал. – hebime

Смежные вопросы