0

Имеется проект https://mihinov.github.io/
При уменьшении окна я планировал, что блок .half__row с двумя img будет сужаться, но на картинке ниже, видно, что ничего не происходит, я пробовал добавлять .half__row значения max-width: 100%; и height: auto;, но всё равно ничего не уменьшается правильно.

Также, при уменьшении всё сужается по первой картинке в блоке .half__row, как будто только первую картинку видит браузер.

введите сюда описание изображения

2
  • Меню не позволяет сделать страницу уже. Она просто масштабируется после того как упрется в меню. i.stack.imgur.com/igW1j.png
    – Skywave
    22 июл 2019 в 4:49
  • меню в header не должно на это влиять, т.к. у header {position: absolute}, я даже пробовал задавать display: none header и меню. 22 июл 2019 в 7:26

1 ответ 1

1

Оберните ваши картинки в div или пропишите правильные стили для картинок.

.container {
  max-width: 700px;
  width: 100%;
  margin: auto;
}
.row {
  width: 100%;
  display: flex;
}
.row + .row {
  margin-top: 25px;
}
img {
  max-width: 100%;
  width: auto;
  height: auto;
}
<div class="container">
  <div class="row">
  <img src="https://via.placeholder.com/450x200">
  <img src="https://via.placeholder.com/250x200">
  </div>
  <div class="row">
    <div><img src="https://via.placeholder.com/450x200"></div>
    <div><img src="https://via.placeholder.com/250x200"></div>
  </div>
</div>

1

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.