CSS свойство row-gap

определение и использование

свойство row-gap определяет интервал между строками в эластичном или сеточном расположении.

свойство row-gap ранее называлось grid-row-gap.

еще см.:

CSS курс:CSS сетка

CSS курс:CSS эластичное расположение

CSS справочник:свойство gap

CSS справочник:свойство column-gap

пример

пример 1

установить 50-пиксельный интервал между строками в сетке:

#grid-container {
  display: grid;
  row-gap: 50px;
}

попробуйте сами

пример 2: эластичное расположение

установить интервал между строками в эластичном контейнере в 70px:

#flex-container {
  display: flex;
  row-gap: 70px;
}

попробуйте сами

CSS синтаксис

row-gap: length|normal|initial|inherit;
значение описание
length установить заданное значение длины или процента для интервала между строками.
normal по умолчанию. Определяет нормальное расстояние между строками.
initial установить этот атрибут в его значение по умолчанию. См. также initial.
inherit переходит от родительского элемента. См. также inherit.

технические детали

по умолчанию: normal
наследование: нет
анимация: поддерживается. См. отдельные свойства. См. также:связанные с анимацией свойства.
версия: Модуль выравнивания коробки CSS уровня 3
JavaScript синтаксис: object.style.rowGap="50px"

поддержка браузерами

числа в таблице указывают на первую версию браузера, которая полностью поддерживает этот атрибут.

расположение Chrome IE / Edge Firefox Safari Opera
в сетке 66 16 61 12 53
в эластичном контейнере 84 84 63 14.1 70