cheat-sheets icon indicating copy to clipboard operation
cheat-sheets copied to clipboard

Published 20 hours ago • verified publisher icon spences10

center things

Open spences10 opened this issue 5 years ago • 1 comments

My new favourite way to vertically + horizontally center something:

.parent { display: grid; place-items: center; }

So much more semantic than justify-content/align-items!

See it in action: https://t.co/0ohvfbQ64a

H/t to the CSS Tricks newsletter

Via Josh Comenu on Twitter

spences10 avatar Dec 27 '19 09:12 spences10

:wave: @spences10

I like that syntax with CSS Grid too. I spun up a few examples of common ways I center an element vertically and horizontally in this CodePen if it helps at all :)

https://codepen.io/tannerdolby/pen/eYGJpqa?editors=1100

tannerdolby avatar Dec 05 '21 21:12 tannerdolby