Не отвечающий флексбокс контейнера не достигает высоты 100% и ширины 50n% ⇐ CSS

[Anonymous]

У меня проблемы с тем, что я не могу отобразить контейнер высотой 100 % и шириной 50 % на моем экране, несмотря на то, что мой CSS уже упоминает эти указанные размеры в соответствующем классе div. Я хочу, чтобы он выглядел как мой дизайн на первом изображении ниже, но в результате я получил второе изображение ниже.
введите описание изображения здесь
Мой результат — тот, что ниже
введите здесь описание изображения
Это мой текущий HTML-код

Код: Выделить всё

[img]file:///C:/xampp/htdocs/templatemo_591_villa_agency/assets/images/Passport-PNG-Free-Image.png[/img]
            alt="Passport-PNG-Free-Image">

ID Confirmation
Register to continue

Вы можете просмотреть мой полный HTML и CSS в моей полной работе над codepen: моя полная работа в codepen
кроме проблемы с контейнером для моего паспорта image, контейнер справа с div class="ID-приложение не будет отображать текст с выравниванием по левому краю и выравниванием по центру содержимого, несмотря на то, что я уже упоминал об этом в своем CSS. Пожалуйста, помогите мне исправить эту ошибку. Спасибо. вы
Я попробовал переместить атрибут display: flex из встроенного CSS во внешний CSS в надежде сделать страницу более отзывчивой и поместил оба контейнера div в один и тот же класс div, который использует свойство flex, чтобы они одинаково отображались рядом с sif=de, но это не сработало.

Подробнее здесь: https://stackoverflow.com/questions/787 ... dth-of-50n