CSS Café

In town for @CSSDayConf on June 5–6? Join the Pre-CSS Day Afternoon Event on June 4 at 16:00 — hosted by CMD Amsterdam 🇳🇱 Talks by Nils Binder & Miriam Suzanne, plus student CSS showcases ✨ 🎟 Free RSVP: gath.io/KwVtysIkOWcUPP…

Introducing 🤯 flex-wrap: balance 🤯 Would you use this? ⚠️ Not a "real" feature yet, just something one of our engineers has been working on. (You can try it out in the latest Chrome Canary with the experimental web platform features flag though!)

curved scrollbar 👨‍🍳 powered by GSAP + CSS scroll-snap + SVG

These were the links that flew by during today's meetup: * sinds1971.nl * sinds1971.nl/csscafe/ (Sanne's demos) * codepen.io/collection/rBV… * youtube.com/watch?v=6-258R… * opencollective.com/oddbird-open-s… * weloveweb.fdnd.nl

Ever wondered why tennis drags while squash is nonstop action? Or why tennis feels like watching paint dry? 🤨🏆🔥 Then Manuel has the perfect talk for you, happening tomorrow at 5PM CET / 11AM EST at our cozy café ☕ 👇 meetup.com/css-cafe/event…

Ever wondered what a color space is & what a color model? What wide gamut means? If P3 is a color space, a color model, or maybe even both? Also LCH, OKLAB, WTF...?!😖 Then we have the perfect talk for you, happening tomorrow @ 5PM CET / 11AM EST ☕ 👇 meetup.com/css-cafe/event…

✂️ Achieve optical balance with CSS text-box-trim → goo.gle/4jcUOFX Chrome 133 lets you tailor the space above and below text, giving developers and designers more control over text layout and appearance.

CSS Custom Functions are coming … and they are going to be a game changer! 👉 brm.us/css-custom-fun…

There Rachel also mentioned this reading-flow examples page: chrome.dev/reading-flow-e… And finally, Lippe tried to break the internet with this adventurous contruction: lpnsk.com/gtr/flexbox.ht… :D

Thank you folks for attending today's meetup. It was wonderful to be back at it! We didn't circulate too many links this time in the chat, but @rachelandrew's presentation had plenty of links on the slides which you can find here: noti.st/rachelandrew/A…

This is going to happen tomorrow 😍 👇 meetup.com/css-cafe/event…

ya'll got so excited, you excited the engineer to start prototyping! x.com/intenttoship/s…

😍 PSA: ident() is an upcoming CSS feature I’m incredibly excited about and you're about to be too. It will allow you to compose CSS variable names from other variables, making code like this possible: 😍 Spec: #ident" target="_blank" rel="nofollow noopener">drafts.csswg.org/css-values-5/#… Proposal (by @bramus): github.com/w3c/csswg-draf…

Join us for the first CSS Café meetup of the year! 🎉 @rachelandrew will show us a new solution for the visual vs. source order disconnect in CSS: the upcoming reading-flow property! 🌐✨ meetup.com/css-cafe/event…

Dang I'm excited about new semantic attr() capabilities in CSS! I wrote a post about why this feature is so powerful, how it could change the way you build components, and how I would use it. Advanced attr() is rolling out in Chrome 133 starting next week 🥰 una.im/advanced-attr/

🔥 Remember Internet Explorer’s Page Transitions? THEY’RE BACK BABY! 👾 Demo: ie-page-transitions.netlify.app ⌨ Repo: github.com/bramus/ie-page… To configure these, use the meta tags from the olden days + load up the library. Works in IE 5.5–7.0, Chrome 126+, and Safari 18.2 (buggy).

As of Chrome 131 you have more options to style `<details>` and `<summary>`. You can now use of the `display` property on these elements, and also use a `::details-content` pseudo-element to style the part that expands and collapses. developer.chrome.com/blog/styling-d…

The stretch keyword: a better alternative to width: 100% in CSS? fullystacked.net/stretch/ (via @stefanjudis)

30 years ago, on Oct 10 1994, I first proposed CSS. It's been an adventure to see CSS as a baby, teenager, and aspiring professional. Sometimes misbehaved, but mostly a source of joy and excitement. w3.org/People/howcome… @w3c @printcssrocks @WebDesignMuseum @prince_xml

Card stack using scroll-driven animation w/ snapping. Just a few lines of JS, zero dependencies. Code + demo via @CodePen codepen.io/paulnoble/pen/…