What exactly does start mean? The left side or top?
What exactly does end mean? The right side or bottom?
With the following code:
The buildings look like this
then when you change to
flex-end the buildings move to the bottom.
Then in this example
flex-endlooks like this:
flex-start sends it to the left border.
My question is: Why aren’t the boxes moving in the same way as the buildings? Why aren’t they stuck down at the bottom?
the alignment is set along the main axis (if the flex display main axis is x, then alignment is based on horizontal movement, if it is y, then it is based on vertical movement)
check the alignment setup for the buildings, was it row (x) or column (y) vs the other example (row or column)
Thanks for answering.
So the css for the purple building has
align-items: center; which would mean it’s moving on its y axis, right?
justify-content then move it along the x axis, then?
this is the axis specification. column here means y (items are displayed like a column)