I Fucking Love Css Grid

March 12, 2021

I love that instead of doing this:

.container {
  display: flex;

  & > .mat-card {
    flex: 1;
    margin-right: 30px;

    &:last-of-type {
      margin-right: 0;
    }
  }
}

I can just do this:

.container {
  display: grid;
  gap: 30px;
  grid-template-columns: repeat(3, 1fr);
}