CSS Grid - из-за разрыва сетки контейнер становится слишком маленьким - PullRequest
0 голосов
/ 27 августа 2018

Я довольно новичок в CSS-Grid и не совсем все понимаю.Но как только я установил пробел в сетке, контейнерный элемент, кажется, становится маленьким, чтобы содержать все элементы.Все выглядит так, как ожидалось, но если я осмотрю контейнер, я вижу, что он слишком узкий.Что я сделал не так?

Вот скрипка, где вы можете увидеть проблему.На синем фоне не должно быть нескольких пикселей справа.

article {
  display: grid;
  grid-template-columns: 50% 50%;;
  grid-template-rows: 280px auto;
  grid-gap: 6px;
  background-color: #2196F3;
  height: 424px;
  width: 560px;
}

article > div {
  background-color: #f1a76c;
}

article > div.large{ 
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;
}

https://jsfiddle.net/juqqernaut/56tz9cv3/10/

Спасибо за помощь

1 Ответ

0 голосов
/ 27 августа 2018

Вы можете использовать grid-template-columns: repeat(2, 1fr) для article элемента.

Обновлено - https://jsfiddle.net/56tz9cv3/17/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...