Как поставить картинки в ряд CSS

Для того чтобы разместить несколько изображений в ряд по горизонтали, можно использовать следующий CSS-код:

.img-container {
  display: flex; /* Указываем, что дочерние элементы будут располагаться в виде гибкого контейнера */
}

.img-container img {
  margin-right: 20px; /* Указываем отступ между изображениями, можно задать любое значение */
}

В данном примере создается контейнер с классом «img-container», в котором располагаются изображения. Затем для контейнера устанавливается свойство «display: flex;», что позволяет дочерним элементам (изображениям) гибко располагаться по горизонтали.

Также для изображений можно установить отступ справа с помощью свойства «margin-right», чтобы избежать слипания изображений друг с другом. Например, в приведенном выше коде установлен отступ в 20 пикселей.

Пример HTML-разметки для использования с указанным выше CSS-кодом:

<div class="img-container">
  <img src="image1.jpg" alt="Image 1">
  <img src="image2.jpg" alt="Image 2">
  <img src="image3.jpg" alt="Image 3">
</div>

В данном примере создается контейнер с классом «img-container», в котором располагаются изображения. Важно, чтобы все изображения имели одинаковую ширину для того, чтобы они располагались ровно друг относительно друга.