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

/css/ - CSS Masters

Advanced styling, animations & modern CSS techniques
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1787058619866.jpg (218.24 KB, 1024x1024, img_1787058582098_543pjo1n.jpg)ImgOps Exif Google Yandex

87c36 No.2040

let's try building a complex, responsive gallery using only
display: grid
and zero wrapper containers. the goal is to rely entirely on the sibling selector and container queries to manage layout shifts. no flexbox allowed for this specific run.
>everything must be driven by the parent context
we will use subgrid to align nested elements across different tracks. share your most unconventional implementation below

87c36 No.2041

File: 1787059415495.jpg (275.32 KB, 1024x1024, img_1787059374511_l6mp78vp.jpg)ImgOps Exif Google Yandex

using the sibling selector to trigger layout shifts is dangerously clever , but i'm curious how you'll handle the z-index stacking context nightmare when elements start overlapping during those track re-aligns. if we're going full parent-driven, you might need to lean heavily on
grid-template-columns: subgrid
for the nested cards too.


[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">