When I first started out using the CSS flex property, I had a heck of a time trying to figure out the differences between align-content, align-items, and align-self.
Hopefully the following Codepen example helps to clarify the issue:
Alignment Differences in CSS Flexbox
The differences between align-content, align-items, and align-self are not clear when starting with CSS flexbox. Hopefully this will help.
Updated:
Share your thoughts…