Спрайты не корректно заправляются в сафари только на некоторых компьютерах

Question

В настоящее время я работаю над веб-дизайном csss с уважением и имеет несколько спрайтов для разных состояний кнопок.

В этом случае я протестировал веб-дизайн в Firefox, Opera, IE (совместимость с IE8), Chrome и Safari, и все отображается правильно. Веб-сайт протестирован под разными сотовыми телефонами и планшетами с разными браузерами без каких-либо проблем.

Я нахожусь на заключительных этапах тестирования, и у коллег видят, как веб-сайт выглядит в разных разрешениях ... Друг, которому принадлежит программа macbook pro, является единственным, кто сталкивается с этой проблемой и только под сафари, что делает его мне трудно ориентироваться и решать. Я попытался воспроизвести проблему, используя его размер экрана, и переключил режим сафари на режим пользователя Mac без успеха.

Код следующее:

.buttons-menu .btn .rules, .buttons-menu .btn .contact , .buttons-menu .btn .tickets , .buttons-menu .btn .profile { display: block; width: 143px;height: 32.5px;padding-top: 37.5px; background-size: 100% 300%;} 
.buttons-menu .btn .rules {background: url(../images/sprite-button-03.png); background-position: 0 -100%;} 

Проблема заключается в том, что этот тестер видит около 2 пикселей второй части спрайта, когда он не должен, и это только в сафари.

Благодарим вас за это.

EDIT: РЕШЕНИЕ: Как полагает ralph.m, проблема исходила из округления десятичных знаков в сафари, которые не всегда ведут себя так же, как в других браузерах.

Answer 1

Избегайте использования таких значений, как .5px. Браузеру придется округлить это вверх или вниз до целого числа, и вы не знаете, в каком направлении он пойдет.