Перейти к содержанию
cloudrc

[РЕШЕНО] Кривое отображение шрифтов на Android

Рекомендуемые сообщения

Доброго времени суток!

Давно уже мучает вопрос, но все никак не находил времени разобраться в этом.

 

На устройствах Samsun Galaxy S4 и S5 тег <p> выглядит увеличенным, по сравнению с другими тегами(скрин прикрепил). На альбомной ориентации все нормально.

На iPhone и iPad все отлично.

Шрифт 12px, Verdana.

 

Может сталкивался кто с этой проблемой?

 

Сайт: pl-eas-ured-ay.r-u (без тире, чтобы не индексировалось)

post-686629-0-40317600-1431446950_thumb.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Тема какая?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Тема какая?

Дефолтная

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Тема какая?

Более того, это не первый проект, где шрифты были увеличены на Android, просто сейчас только решил этим заняться

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Дефолтная

Дефолтная тема не оптимизирована и не адаптирована под мобильные девайсы

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Дефолтная тема не оптимизирована и не адаптирована под мобильные девайсы

Это понимаю) Я надеюсь, что кто-нибудь нашел способ решения этого косяка)

Кстати, так только в портретной ориентации экрана, в альбомной все ОК

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Добавить перед

  <meta name="description" content="" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Спасибо, помогло!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Только после этого метода все страницы открываются "в углу", то есть сайт открывается в реальном размера, а видимость задается границами экрана.

Потом приходится щипками расширять сайт(

post-686629-0-06669000-1431453599_thumb.jpg

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Решилось этим способом:

<meta name="viewport" content="width=device-width">

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

А да, лишнего скопировал.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Вспомнил почему-то эту тему)

 

При примерах выше все равно на некоторых браузерах текст выглядел коряво.

 

Решилось этим способом, проверено на более 15 мобильных устройствах:

*{
	max-height:20000px;
}
body{
	overflow: hidden;
	min-height: 100%;
	margin:0px;
	padding:0px;
	min-width:1280px;     ->     При container 1230px
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust: none;
    height:100%;
	}

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.