Align Content

Utilities for controlling how rows are positioned in multi-row flex and grid containers.

Class CSS Output
content-end
align-content: flex-end;
}
content-stretch
align-content: stretch;
}
content-evenly
align-content: space-evenly;
}
content-normal
align-content: normal;
}
content-center
align-content: center;
}
content-start
align-content: flex-start;
}
content-around
align-content: space-around;
}
content-baseline
align-content: baseline;
}
content-between
align-content: space-between;
}
content-center-safe
align-content: safe center;
}

content-end

align-content: flex-end;

content-stretch

align-content: stretch;

content-evenly

align-content: space-evenly;

content-normal

align-content: normal;

content-center

align-content: center;

content-start

align-content: flex-start;

content-around

align-content: space-around;

content-baseline

align-content: baseline;

content-between

align-content: space-between;

content-center-safe

align-content: safe center;

Reference

align-content MDN ↗

CSS Properties

  • align-content