Hacker News new | ask | show | jobs
by city41 2380 days ago
Nice guide, thanks for writing it. I can never remember which directions align/justify impact. The best mnemonic I could think of was justified text. When you click the justify button on a text paragraph in a typical word processor, it impacts the text in the same direction as justify-content in flexbox does.
1 comments

You just have to remember that if the flex-direction is column, align/justify also flip. Which is partly why it's so confusing.
Defining then relative to the flex direction makes sense, but the choice of which one is with the flow and which is across it is arbitrary, chosen between two words that normally mean with the flow. It'd make more sense if the properties were flex-justify and flex-justify-cross, or flex-align and flex-align-across.
They are the same in relation to the flex-direction. Justify goes with the direction, align goes perpendicular to it. But still I agree, I've now been using flexbox for a long time and I still find myself second guessing a lot.
Reading your comment gave me the mnemonic “a line goes perpendicular to it” which I think will come in handy (for me at least).