align-content now works in the default layout in 2024, simplifying vertical centering with just one CSS property. Currently supported by Chrome 123, Firefox 125, and Safari 17.4. This marks a significant improvement as previously, developers had to resort to flexbox or grid for alignment. The addition of align-content for flow layout eliminates the need for additional div wrappers. Interestingly, this change comes after years of complicated alignment methods including table cells, absolute positioning, and pseudo-elements. The post questions the confusing nature of CSS and highlights the need for unified alignment properties. In conclusion, mastering CSS requires focus and understanding rather than trial and error.
https://build-your-own.org/blog/20240813_css_vertical_center/