Links
Tailwind is the worst form of CSS, except for all the others
I get why Tailwind’s opinions come across as abrasive. And I’m not here to change your mind. But maybe I can offer you a fresh perspective. Maybe I can even convince you that, whether you like it or not, Tailwind is good for you and your team because opinionated tools are good for you and your team… even if you disagree with the opinion.
View Transition List Reordering (with a Kick Flip)
It's pretty straightforward to animate list items into new positions, but there is a few tricks when the specific one you've chosen to move needs a different transition.
What is popover=hint?
Learn about what exactly this new popover feature does and how it relates to interest invokers.
Creating proportional, equal-height image rows with CSS, 11ty, and Nunjucks
Equal-height image layouts seem simple until you try to build one that's truly responsive. This tutorial walks through my solution using flexbox aspect ratios, the Eleventy Image plugin, and a Nunjucks shortcode.
A revisit of the Every Layout sidebar with :has() and selector performance
Heydon Pickering takes a fresh look the Every Layout Sidebar layout, 6 years on, to see if modern CSS selectors can improve it.
Videos
Form control styling
Text inputs, checkboxes, radio buttons, sliders… Form controls have been part of the web since the beginning, but styling them can still feel like a battle. If you’ve spent time struggling to figure out countless lines of CSS to make them look right, or rebuilt native elements from scratch because they weren’t customizable enough, you’re not alone. In this session, we’ll explore why HTML form controls have been so hard to style — and introduce upcoming improvements that will make them easier to customize, using only the power of CSS. You’ll also get a peek at how form controls have evolved, and how the new enhancements fit into the broader web ecosystem. If you’ve ever struggled with form controls, this talk will give you practical insight and a glimpse of what’s next.
Sponsor
Sponsored by Cloud Four
Thanks to Cloud Four for sponsoring this week’s newsletter! They solve complex responsive web design and development challenges for ecommerce, healthcare, fashion, B2B, SaaS, and nonprofit organizations.
If you’d like to help with the costs of running Friday Front-End, you can back our Patreon for as little as a dollar a month.