Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Размер элементов button на смартфонах 
V
    Опции темы
Роман
Дата 26.4.2021, 12:59 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 279
Регистрация: 9.7.2006

Репутация: нет
Всего: 1



При просмотре страницы на смартфоне, элементы button слишком уменьшаются.
Указание font-size не помогает. В итоге я не могу добиться одинакового размера шрифта на кнопках и основным текстом.
К тому же еще и max-width тоже как будто занижен. На ПК все выглядит совсем иначе.
Ссылка на страницу https://lyrics-training.neocities.org/


--------------------
Жизнь -  это последствия от последствий.
user posted image
PM ICQ   Вверх
Роман
Дата 26.4.2021, 14:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 279
Регистрация: 9.7.2006

Репутация: нет
Всего: 1



А вот здесь все идеально, и на ПК и на смартфоне: https://sites.google.com/view/lyrictraningr8aivyqduqe/home
Код один и тот-же, только здесь код во фрейме.


--------------------
Жизнь -  это последствия от последствий.
user posted image
PM ICQ   Вверх
Oldshelf
Дата 26.4.2021, 16:33 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 157
Регистрация: 22.4.2018

Репутация: нет
Всего: 4



Для масштабирования элемента под размеры окна удобно использовать единицу измерения vmin:
Код

<input type="button" style="background:#555555;color:white;width:32vmin;height:10vmin;font-size:5vmin" value="Test" class="test" />

PM MAIL WWW   Вверх
Роман
Дата 26.4.2021, 17:12 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 279
Регистрация: 9.7.2006

Репутация: нет
Всего: 1



Мне помог мета-тег
Код

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



--------------------
Жизнь -  это последствия от последствий.
user posted image
PM ICQ   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
1 Пользователей читают эту тему (1 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »


 




[ Время генерации скрипта: 0.1093 ]   [ Использовано запросов: 20 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.