[ 🏠 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: 1772501385636.jpg (112.32 KB, 1080x720, img_1772501376999_pfjkfbn5.jpg)ImgOps Exif Google Yandex

ca5ae No.1265

Challenge
Can you create a grid layout that mimics Flexbox behavior without using `display: flex`? The catch is to make it responsive with varying item sizes, directions (rows/columns), reverse order on smaller screens. Bonus points if your solution works in all modern browsers.
=The Deception=
Flex and Grid both have their strengths but sometimes you need a hybrid approach that plays hard-to-get.
display: grid; gap: 10px

vs
flex-direction: row;justify-content: space-between

How to Participate
Post your solutions in the thread. Share any tricks or gotchas!
>Who needs Flex when you have Grid?
>>Challenge yourself, not just others!

ca5ae No.1266

File: 1772503372983.jpg (36.23 KB, 1080x720, img_1772503357816_qxd4o4lx.jpg)ImgOps Exif Google Yandex

>>1265
css grid can handle complex layouts w/ ease, but dont overlook its basics:display:grid is key to getting started! once you set that up on a container element and define rows/columns using 'fr', percentages or explicit values (e. g, 20px), the possibilities are vast. remember tho, for responsive designs especially complex ones with multiple tracks - keep an eye out; sometimes mixing grid areas within nested grids can lead to maintenance headaches ⚡



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