Conditional CSS with :has and :nth-last-child
Ahmad Shadeed highlights a few examples of where you can combine a CSS selector with :has() to create conditional component/layout states.
Issue #549
Solving Media Object Float Issues With CSS Block Formatting Contexts
Gabriel Shoyombo covers common problems with CSS floats and how to solve them using a block formatting context (BFC).
From Our Sponsor
Connect your teams in ClickUp
One tool does it all—ClickUp offers all the features you need in one platform: Tasks, Docs, Whiteboards, Dashboards, Goals… and more!
CSS Weekly on YouTube
▶ Baseline: A NEW Way To Think About Browser Support
Baseline is a new initiative that brings clarity to information about browser support for web platform features; it will help you determine which browser features are safe to use in production. In this short overview, you’ll find out everything you need to know about it.
▶ Chrome DevTools Tips - How to easily revert all CSS changes in Styles Pane
Find out how you can easily view and revert all CSS changes you’ve made in Chrome DevTools Styles Pane using the “Changes” drawer.
What Have I Been Up To
Integrating Prettier Into Your Workflow
For the past few weeks, I’ve been working diligently on Module 4 of my Mastering Prettier & Stylelint course.
I’ll show you how to fully integrate Prettier into your workflow, from sharing configurations, setting it up with pre-commit hooks, and using it within testing frameworks, task runners, and Continous Integration. I’m quite certain you’ll find it interesting and helpful.
Pre-launch price is still active, and you can use the coupon code SUBSCRIBER20 to get an additional 20% off on the Masterclass package as a CSS Weekly subscriber.
Inspiration
Ideas for Grid to Slideshow Switch Animations
Manoela Ilic shares some ideas and inspiration for layout animations where we go from an irregular grid to a slideshow or alternative view.