Задать вопрос
NikMaster777
@NikMaster777

Как в griid выровнять по центру не полный ряд?

Ребята подскажите как в grid выровнять колонку в ряду по центру? Ситуация следующая.
Выравниваю например:
grid-template-columns: repeat(auto-fill, minmax(40%, 1fr));
Получаю расположение (если по 2 блока в ряду):
- -
-
А нужно чтобы во втором ряду колонка была по центру так как она там одна:
- -
-
  • Вопрос задан
  • 190 просмотров
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ответы на вопрос 1
NikMaster777
@NikMaster777 Автор вопроса
Получилось так:
<head>
  <style>
    .grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  position: relative;
  width: 40%;
}

.grid-item {
  border: 1px solid black;
  padding: 10px;
  text-align: center;
}

.grid-item:nth-child(4),
.grid-item:nth-child(5) {
  position: relative;
  left: 50%;
}

  </style>
</head>
<body>
  <div class="grid-container">
  <div class="grid-item">1</div>
  <div class="grid-item">2</div>
  <div class="grid-item">3</div>
  <div class="grid-item">4</div>
  <div class="grid-item">5</div>
</div>

</body>
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы