Duration: 4:27

14,835 views

1,010

The Pile is a CSS and HTML mini web machine that enables easy and powerful element layering, like how a discard pile or dog pile work, last in is on top. This layout mini web machine replaces many use cases for position absolute, offers keyword alignments, optional z-index management, no container collapsing (i'm looking at you container with absolute children), and can be intrinsically sized based on content.

This layout machine can scale and adapt to many different use cases and has saved me tons of time, hopefully it will help you too!

Resources:
The Pile (basic) → https://goo.gle/3UNljHE
The Pile (self aligned) → https://goo.gle/3URC3NS
The Pile (group aligned) → https://goo.gle/3QCDJIO
The Pile visualized → https://goo.gle/3QAyWr7
Grid natural to Pile toggle → https://goo.gle/3UQCYyo
Icon Button → https://goo.gle/3UNn73w
VisBug Logo → https://goo.gle/3UMik2d
Blobby Button → https://goo.gle/4bqfPIq
Image Caption → https://goo.gle/3UPG7y9
Explode a node → https://goo.gle/4a5DpsY
GUI Challenges - Compare → https://goo.gle/3ylbiIQ
GUI Challenges - Card Stack → https://goo.gle/4dzqjqX
GUI Challenges - Stories → https://goo.gle/4a6aTYh

Subscribe to Chrome for Developers → https://goo.gle/ChromeDevs


#ChromeForDevelopers #Chrome


Speaker: Adam Argyle