Свойство grid-column-gap
Определяет отступ между столбцами контейнера grid сетки.
grid-column-gap: 15px;Пошаговый план! Как быстро научиться создавать сайты!
- поддерживается начиная с
- частичная поддержка до
- не поддерживается
Значения
grid-column-gap: 0;
Без указания отступа между столбцами grid сетки
<div class="grid-1">
<div class="grid-1-col bg-green">1 Колонка</div>
<div class="grid-1-col bg-red">2 Колонка</div>
</div>
<style>
.grid-1 {
display: grid;
grid-template-columns: auto auto;
grid-column-gap: 0;
}
.grid-1-col {
padding: 1rem;
}
</style>1 Колонка
2 Колонка
grid-column-gap: 15px;
Для указания отступа между столбцами grid сетки вы можете использовать любые единицы измерения
<div class="grid-2">
<div class="grid-2-col bg-green">1 Колонка</div>
<div class="grid-2-col bg-red">2 Колонка</div>
</div>
<style>
.grid-2 {
display: grid;
grid-template-columns: auto auto;
grid-column-gap: 15px;
}
.grid-2-col {
padding: 1rem;
}
</style>1 Колонка
2 Колонка