auto-fit and auto-fill

auto-fit and auto-fill by Wes Bos

HTML

<link rel="stylesheet" href="https://cdn.rawgit.com/wesbos/css-grid/master/assets/style.css">
<div class="container">
  <div class="item item1">Item 01</div>
  <div class="item item2">Item 02</div>
  <div class="item item3">Item 03</div>
  <div class="item item4">Item 04</div>
</div>

CSS

.container {
  display: grid;
  grid-gap: 20px;
  border: 10px solid var(--yellow);
  grid-template-columns: repeat(auto-fit, 150px);
}

.item4 {
  grid-column-end: -1;
}