DEV Community

Cover image for 5 quick ways to center a div with CSS
jun
jun

Posted on

5 quick ways to center a div with CSS

Hello DEV community ๐Ÿ‘‹ Centering div is one of the common problems encountered in front-end layout. Avoid long-windedness, here are five simple and common centering methods:

  1. Using Flexbox
    using flexbox

  2. Using Grid
    using grid

  3. Using Position
    using position

  4. Using Flex and Margin
    using flex and margin

  5. Using Grid and Margin
    using grid and margin

That's it! 5 easy and quick ways to solve one of my most googled css problems in every situation. Welcome to comment if you know of any other way to center a div, cheers! ๐Ÿฆนโ€โ™‚๏ธ

Top comments (0)