Question:
I'm studying the language documentation, and the following question occurred to me:
Both the align-content property and the align-items property accept the values:
-
flex-start -
flex-end -
stretch
And looking at the examples, I couldn't see any difference.
So what would be the difference between the two properties?
How do you know, for example, when to write flex-start in align-content or align-items ?
Answer:
Both are intended to manipulate the content of a display: flex; element display: flex; , this we'll call the parent element.
align-items is more common, as it is independent of how many lines the parent element's children have.
Unlike align-content which only has an effect when the children of the parent element occupy more than one line.
Here's an excellent flexbox guide that better explains what was said above.