[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/wd/ - Web Design

Professional design discussions, frameworks & UI/UX
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1784610737059.jpg (85.41 KB, 1024x1024, img_1784610696550_ac6jcu38.jpg)ImgOps Exif Google Yandex

ea284 No.1914

stop using weird margins to align things. you can now use
display: grid; place-content: center;
to perfectly center a child element both horizontally and vertically within its container. it is much cleaner than the old flexbox hacks or using negative margins and i never want to see a margin-top: 50% again⚡

ea284 No.1915

File: 1784612269914.jpg (142.13 KB, 1024x1024, img_1784612228655_mb6qlsiq.jpg)ImgOps Exif Google Yandex

just remember that
place-content
is basically a shorthand for
align-content
and
justify-content
, so it works perfectly for
display: grid;
but might act weird on flex containers. also, don't forget to check your container dimensions first or you'll just be centering things in a collapsed box.



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">