CSS Centering

You can connect with me on LinkedIn to discuss collaborations and work opportunities.

You can also follow me on Twitter, Bluesky and Mastodon.

Today I find a solution for one of the most common problems I had with CSS, vertical centering. I really don't like CSS, and one of my examples to explain why, it was the lack of a elegant way to vertical align an element inside a div.

First page I found was http://www.jakpsatweb.cz/css/css-vertical-center-solution.html that is a great post, that gets a solution but very very tricky.

Luckily while implementing that solution, I found a very is solution, described here: http://www.w3.org/Style/Examples/007/center.html

As easy as: div.container { display: table-cell; vertical-align: middle; } I don't think that is very intuitive (at least for me), but it's simple.

You can connect with me on LinkedIn to discuss collaborations and work opportunities.

You can also follow me on Twitter, Bluesky and Mastodon.