Мобильная версияПо какой-то причине слева есть большой пробел, из-за которого он переполняется вправо, даже если я установил его равным
Я много раз пытался добавить это в чат gpt, поэтому появлялись странные комментарии, но проблема не устранена. Как я могу изменить свой код, чтобы добиться желаемого макета и поведения?
body { маржа: 0; заполнение: 0; дисплей: гибкий; цвет фона: #f0f0f0; } .container-icon { дисплей: гибкий; гибкое направление: столбец; выровнять-элементы: гибкий старт; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); высота: 100вх; ширина: 36 пикселей; цвет фона: лазурный; радиус границы: 10 пикселей; позиция: абсолютная; слева: 0; } кнопка .container-icon { нижнее поле: 10 пикселей; радиус границы: 50 пикселей; граница: нет; } .заголовок { поле: 0 пикселей 0 пикселей 0; отступ: 10 пикселей; высота: 36 пикселей; ширина: 100%; цвет фона: лазурный; радиус границы: 10 пикселей; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); поле слева: 36 пикселей; дисплей: гибкий; выровнять-элементы: по центру; } кнопка .heading { радиус границы: 50%; граница: нет; поле справа: 10 пикселей; } /* Устанавливаем ширину карточки 200 пикселей */ .карты { ширина: 200 пикселей; высота: 300 пикселей; цвет фона: лазурный; граница: 1 пиксель, сплошная #ccc; радиус границы: 10 пикселей; отступ: 20 пикселей; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); поле: 10 пикселей; } .main-карты { дисплей: гибкий; гибкая упаковка: nowrap; /* Запретить переход на следующую строку */ оправдание-содержание: гибкий старт; разрыв: 10 пикселей; цвет фона: лазурный; маржа сверху: 80 пикселей; Документ
