How to make Flexbox children 100% height of their parent with CSS?

Spread the love

To make Flexbox children 100% height of their parent with CSS. we set the align-items property.

For instance, we write

.flex-2 {
  display: flex;
  align-items: stretch;
}

to make the element with class flex-2 a flex container with display: flex;.

We make the elements inside stretch to fit the height of the parent with align-items: stretch;.

By John Au-Yeung