В телеграм webapp верстка не правильно отображается по ширине
Вот макет на 768px
Вот ссылка на верстку github Вот ссылка на телеграм бот
Вот так отображается в телеграм боте. То есть не помещается по ширине в масштабе.
А на телефоне вот так
Использую такой метатег
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
Что можно сделать, чтобы верстка корректно отображалась в телеграм webapp?
Ответы (1 шт):
Не совсем понимаю, чего ты ожидаешь. Судя по макету на гите, у тебя не адаптирован дизайн под разные разрешения экрана.
Просто пропиши стили. В твоём случае под разные разрешения окон в том числе. В случае открытия приложения в телеграме, всё вообще полностью съезжает.
Скриншот с проверкой реакции макета на разные разрешения:
Приложение в открытом виде:
И вообще, в целом можешь попробовать использовать вместо единицы измерения px. Единицы измерения vh - размер в процентах от высоты экрана. И vw - размер в процентах от ширины экрана.