The Fundamentals of CSS Alignment
September 19, 2025

While centering elements in CSS has become easy over time, there is still a lot of confusion around alignment in general. Let’s be honest, you always end up trying different combinations until it works, but you don’t really understand how it works, right?Which property is for vertical alignment? align-content or align-items? Where should I add display: flex? Let’s add it everywhere! A height? Why do I need to define a height!? Maybe I should try with display: grid?
It’s time to clear all the confusion! Through this exploration, you will understand the logic behind all the alignment properties and how they work in each layout. It’s not another article about centering, we are going beyond!
It feels like we published at least a couple of things along these lines in recent weeks. But I feel too, you can never have too much reinforcement of some of these foundational concepts.
So one more time for the folks at the back, here’s how we can align content in modern CSS layouts natively. It finishes with a quiz.