Loading video...

Video Failed to Load

Go Home

Future CSS Tip! ๐Ÿ”ฎ You can anchor an element to multiple elements with anchor positioning .anchored { top: anchor(--a-1 bottom); left: anchor(--a-2 right); } Combine it with CSS mask to create some "Supercharged CSS โšก๏ธ" Watch the debug below ๐Ÿ‘€ CodePen.IO link below! ๐Ÿ‘‡

149,809 views โ€ข 2 years ago โ€ขvia X (Twitter)

11 Comments

jhey โ–ฒ๐Ÿป๐ŸŽˆ's profile picture
jhey โ–ฒ๐Ÿป๐ŸŽˆ2 years ago

Here's that @CodePen link! ๐Ÿš€ Remember, you'll need to be in Chrome Canary to see this in action ๐Ÿค™ Was reminded of this demo after @chriscoyier showed the Vercel charge lines in a Spark edition. Slowly uploading my CSS Day demos ๐Ÿ˜…

TypeErrorDev's profile picture
TypeErrorDev2 years ago

@CodePen Dude where do you get these ideas? I need an infusion of your imagination

jhey โ–ฒ๐Ÿป๐ŸŽˆ's profile picture
jhey โ–ฒ๐Ÿป๐ŸŽˆ2 years ago

@CodePen Jus' keep on playing and riffing on things I've built or put together and take it from there I guess ๐Ÿ˜… It definitely ebbs and flows but I keep a backlog of ideas and notes if ever I jus' wanna make something random

Brian's profile picture
Brian2 years ago

@CodePen This is some mind blowing stuff that's coming. It's crazy what we can do now and days compared to 10 years ago.

jhey โ–ฒ๐Ÿป๐ŸŽˆ's profile picture
jhey โ–ฒ๐Ÿป๐ŸŽˆ2 years ago

@CodePen I feel lucky because I don't know those times ๐Ÿ˜… I came in a little later and started playing with animations and 3D transforms as my introduction to CSS

Amit's profile picture
Amit2 years ago

@CodePen Great tip! These new features are amazing ๐Ÿ™Œ

jhey โ–ฒ๐Ÿป๐ŸŽˆ's profile picture
jhey โ–ฒ๐Ÿป๐ŸŽˆ2 years ago

@CodePen Looking forward to them being more widely available as I'm sure people will come up with some really cool uses for them ๐Ÿ’ฏ๐Ÿš€

Khoa ๐Ÿ”ฅ's profile picture
Khoa ๐Ÿ”ฅ2 years ago

@CodePen Did you make the above animation?

jhey โ–ฒ๐Ÿป๐ŸŽˆ's profile picture
jhey โ–ฒ๐Ÿป๐ŸŽˆ2 years ago

@CodePen I did! With a little HTML and some CSS โœจ

shaddy's profile picture
shaddy2 years ago

@CodePen Awesome tip. Thanks a lot and keep up

jhey โ–ฒ๐Ÿป๐ŸŽˆ's profile picture
jhey โ–ฒ๐Ÿป๐ŸŽˆ2 years ago

@CodePen Do my best! ๐Ÿ™

Related Videos