Как выровнять картинку с текстом CSS

Для выравнивания картинки с текстом в CSS можно использовать свойство vertical-align. Это свойство устанавливает вертикальное выравнивание элементов внутри строки.

Пример:

img {
  vertical-align: middle; /* выравнивание по середине */
  margin-right: 10px; /* отступ справа от картинки */
}

p {
  display: inline-block; /* установим блочный элемент в виде строчного */
  vertical-align: middle; /* выровняем текст по вертикали относительно картинки */
}

В этом примере картинка выровнена по середине строки с помощью свойства vertical-align: middle. Также задан отступ справа от картинки с помощью свойства margin-right. Текст выровнен относительно картинки с помощью свойства vertical-align: middle, и установлен блочный элемент в виде строчного с помощью свойства display: inline-block.