Вопрос Как адаптировать UI под все разрешения экрана?

Использование процентов и относительных единиц:
Вместо фиксированных значений ширины и высоты элементов используй проценты или относительные единицы, такие как em или rem.

Пример:

img {
  width: 80%; /* Или другое значение в процентах */
  margin: 0 auto; /* Центрирование контейнера */
}

.element {
  width: 50%; /* Или другое значение в процентах */
}

Можешь заюзать еще медиа-запросы, что бы для каждого разрешения устанавливать процентное соотношение

Пример:

img {
  .element {
    width: 100%; /* Или другое значение для маленьких экранов */
  }
}

Используй относительные размеры изображений и атрибуты max-width: 100%; для их адаптации под разрешение(должно помочь)

Пример:

img {
  max-width: 100%;
  height: auto;
}

Я бегу по выженной земле.