Как сделать мой сайт (шириной 480 пикселей) идеально масштабируемым в мобильном safari

#iphone #html #mobile-safari

#iPhone #HTML #mobile-safari

Вопрос:

Основная часть моего сайта имеет ширину 480 пикселей — смотрите Пример здесь:http://5things.me

Он должен идеально поместиться на iphone, но почему-то в представлении по умолчанию используется гораздо более широкая сетка.

Ниже я показываю 2 изображения — первое соответствует тому, как оно выглядит в данный момент, второе — тому, как должно выглядеть.

Мне не нужно делать слишком много настроек для мобильных устройств, поскольку весь сайт имеет ширину всего 480 пикселей =)

текущий

желаемый

Комментарии:

1. и именно поэтому, дети, вам не следует разрабатывать дизайн под определенный размер пикселя.

Ответ №1:

Добавьте это на свою страницу

 <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
  

Смотрите здесь больше тегов, связанных с iPhone:
http://www.omiod.com/iphone/dev-notes.php

Комментарии:

1. На самом деле, это сработало не очень хорошо. потому что это хорошо работало только в ландшафтном режиме. в режиме protrait вы могли видеть только 2/3 экрана <meta name=»viewport» id = «viewport» content = «maximum-scale = 0.6667; width = 480″/> это работало лучше =)