Мобильная версияПривет, кто-нибудь может помочь мне с проблемой макета, с которой я столкнулся. Это пример чат-бота, который я разрабатываю, и я хочу, чтобы чат-бот занимал весь экран, удаляя границы. Когда я пытаюсь это сделать, это нарушает положение существующие элементы, может кто-нибудь помочь мне с этим, пожалуйста? Это HTML-код
чат-бот
Это соответствующий CSS-код
тело { семейство шрифтов: «Segoe UI», Tahoma, Женева, Вердана, без засечек; маржа: 0; заполнение: 0; цвет фона: #ecedf6b9; цвет: #000; выравнивание текста: по центру; размер шрифта: 16 пикселей; } основной { ширина: 100%; высота: 100вх; дисплей: гибкий; оправдание-содержание: центр; выровнять-элементы: по центру; } кнопка { цвет фона: # D5ECFB; белый цвет; отступ: 10 пикселей 20 пикселей; граница: нет; /* радиус границы: 5 пикселей; */ курсор: указатель; /* высота: 16 пикселей; ширина: авто; */ } .attachment-значок { ширина: 20 пикселей; высота: 20 пикселей; } #чат-контейнер { ширина: 80%; /* максимальная ширина: 600 пикселей; минимальная ширина: 300 пикселей; минимальная высота: 300 пикселей; максимальная высота: 80vh; */ поле: 20 пикселей; цвет фона: rgba(241241245255); граница: 2 пикселя, сплошная #ccc; /* радиус границы: 10 пикселей; */ отступ: 10 пикселей; переполнение-у: авто; переполнение-х: скрыто; дисплей: гибкий; гибкое направление: столбец; } #чат { стиль списка: нет; заполнение: 0; маржа: 0; высота: 440 пикселей; переполнение-у: авто; /* Включаем вертикальную прокрутку, когда содержимое превышает высоту */ ширина: 100%; черный цвет; } #input-container { дисплей: гибкий; отступ: 5 пикселей; выровнять-элементы: по центру; положение: родственник; /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); */ } #input-message { гибкий: 1; отступ: 10 пикселей; граница: нет; радиус границы: 2 пикселя; } #кнопка отправки, #attach-кнопка { ширина: 20 пикселей; высота: 20 пикселей; граница: нет; радиус границы: 2 пикселя; дисплей: гибкий; оправдание-содержание: центр; выровнять-элементы: по центру; цвет фона: #d5ecfbf6; курсор: указатель; поле сверху: 4 пикселя; отступ: 13 пикселей; позиция: абсолютная; } #кнопка отправки { поле справа: 5 пикселей; } #input-message:focus { контур: нет; } Может ли кто-нибудь отобразить это в своем браузере и помочь мне со стилем? Мне нужно, чтобы весь чат-бот был масштабируемым, например, при сворачивании и развертывании экрана элементы в моем html-диалоге должны соответствующим образом масштабироваться
