Categories
CSS

How to align the last row to the grid with CSS Flexbox?

Spread the love

To align the last row to the grid with CSS Flexbox, we use the :after selector.

For instance, we write

.grid {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.grid::after {
  content: "";
  flex: auto;
}

to add the flex: auto; to the part of the page after the element with class grid to align the last row to the grid.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *