Ответы пользователя по тегу CSS Grid
  • Как убрать пусто пространство в гриде?

    @volucris1
    Ипользуй флекс:
    Пример на CodePen
    Если забанили в CodePen:
    Спойлер...

    <div class="parent">
      <div class="child">1</div>
      <div class="child">2</div>
      <div class="child">3</div>
      <div class="child">4</div>
      <div class="child">5</div>
    </div>

    .parent {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      flex-basis: auto;
      
      width: 100%;
      height: 250px;
      background-color: indigo;
    }
    
    .child {
      width: 33.33333%;
      height: 100px;
      background-color: pink;
      border: 1px solid indigo;
      box-sizing: border-box;
    }
    
    .child:nth-child(3n+1):nth-last-child(2),
    .child:nth-child(3n+1):nth-last-child(2) + div {
      width: 50%;
    }
    
    .child:nth-child(3n+1):last-child {
      width: 100%;
    }

    Ответ написан
    Комментировать