Retina Display Issue

Question

Я пытаюсь сохранить изображение из Photoshop, которое будет использоваться на веб-странице, и оно отображается в два раза больше на моей веб-странице, чем в фотошопе. Он также выглядит слегка размытым, как если бы он был увеличен на 200%.

Изображение 600px х 165px, и CSS для изображения следующим образом:

display: block; 
width: 600px; 
height: 165px; 
background: transparent url(logo.png) left top no-repeat; 
text-indent: 100%; 
overflow: hidden; 
white-space: nowrap; 

Почему отображая в два раза больше в Chrome, как в Photoshop? Как заставить Chrome отображать его в правильном размере?

Answer 1

Это может быть супер очевидным, но ваш браузер увеличен?

Answer 2

Удалить высоты и свойства Ширина - Это должно установить его размер, что он установлен в Photoshop

display: block; 
background: transparent url(logo.png) left top no-repeat; 
text-indent: 100%; 
overflow: hidden; 
white-space: nowrap;