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

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

Ребята подскажите как в grid выровнять колонку в ряду по центру? Ситуация следующая.
Выравниваю например:
grid-template-columns: repeat(auto-fill, minmax(40%, 1fr));
Получаю расположение (если по 2 блока в ряду):
- -
-
А нужно чтобы во втором ряду колонка была по центру так как она там одна:
- -
-
  • Вопрос задан
  • 181 просмотр
Комментировать
Подписаться 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>
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

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

Похожие вопросы
Вакансии с Хабр Карьеры
Fullstack Developer под Wordpress
Future Search
от 90 000 до 150 000 ₽
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
Trainee - IT Support
move2usajobs LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
На сайте на modx сделать три задачи
22 нояб. 2024, в 13:15
3000 руб./за проект
Убрать ошибку settings.php при входе в админку Битрикс 1с
22 нояб. 2024, в 13:09
500 руб./за проект
Разработать дизайн сайта
22 нояб. 2024, в 12:53
25000 руб./за проект
Ещё заказы