DEV Community

Robson Muniz
Robson Muniz

Posted on

🔥3 Ways to Center Content Horizontally and Vertically in CSS✨

#html #css #webdev #beginners

3 Ways to Center Content Horizontally and Vertically in CSS✨

Classic Option

.classic{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
Enter fullscreen mode Exit fullscreen mode

CSS Grid Way

.grid{ display: grid; place-items: center; }
Enter fullscreen mode Exit fullscreen mode

Flexbox Way

.flexbox{ display: flex; align-items: center; justify-content: center; }
Enter fullscreen mode Exit fullscreen mode

đź›´ Follow me on:
https://bit.ly/3oBQbc0

Top comments (0)