Размеры HTML / CSS, заданные в процентах, неправильно отображаются в Safari. - PullRequest
4 голосов
/ 07 марта 2012

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

Размеры указаны в процентах. Он отлично работает с IE7 +, Firefox и Chrome, но не с Safari. Это искажает изображение резко!

Нужно ли использовать JavaScript для правильного отображения изображения?

Заранее спасибо ...

1 Ответ

7 голосов
/ 07 марта 2012

Код вопроса:

<img src="images/uftMap.jpg" border="0" width="95%" height="95%" alt="Universal Fitness &amp; Training on Google maps" name="Universal Fitness &amp; Training on Google maps">

Удалите атрибут высоты, и браузер изменит его пропорционально.

Указание процентов в атрибутах высоты и ширины не является строго копацетным. Из HTML5 spec

высота = неотрицательное целое число: Высота изображения в пикселях CSS.

ширина = неотрицательное целое число: Ширина изображения в пикселях CSS.

Если вы настроили стиль этого встроенного элемента, а не таблицы стилей, вам лучше использовать атрибут стиля:

<img src="images/uftMap.jpg" border="0" style="max-width: 95%" alt="Universal Fitness &amp; Training on Google maps" name="Universal Fitness &amp; Training on Google maps">
...