What’s !essential #12 talks concerning the outdated (testing in Safari while you don’t have Safari), the brand new (::checkmark), the in-between (anchor positioning however with HTML), and extra.
Buckle up!
Testing in Safari while you don’t have Safari
Safari is the second hottest net browser, however is just accessible to Apple customers. Truthful sufficient. I imply, Apple are closely invested in making Safari a proprietary browser that’s deeply built-in with Apple’s software program and {hardware}. Nevertheless, this makes testing web sites in Safari a little bit of a ache. Declan Chidlow defined what our choices are with reference to testing in Safari while you don’t have Safari.
A primary take a look at ::checkmark
Sunkanmi Fafowora gave us our first take a look at the ::checkmark pseudo-element, which solves the age-old drawback of not (actually) having the ability to model checkmarks. Notice that this additionally targets the checked state indicator of radios and selects, not simply checkboxes!
Totally different form types with border-shape + form()
Temani Afif identified that we are able to create extra form types when combining border-shape with the form() perform (in comparison with clip-path), and, simply swap between them.
A concise information to sibling-index() and sibling-count()
Durgesh Pawar did a deep dive on sibling-index() and sibling-count(), exhibiting us all the cool issues that we are able to do with these almost-Baseline CSS features.
Additionally, don’t miss Durgesh’s two-part sequence about View Transition gotchas proper right here on CSS-Methods.
Managing anchor associations with knowledge attributes and superior attr()
This one’s really from me! Dissatisfied to listen to that the anchor attribute has been dropped, which might’ve supplied a method of managing anchor associations utilizing HTML, I demonstrated my different method that entails managing anchor associations with knowledge attributes and superior attr().
I gained’t spoiler the CSS, however listed below are the totally different HTML syntaxes that I explored:
Boat A
Anchor A
Boat A
Anchor A
Boat A
Anchor A
Take the State of CSS 2026 survey
It’s that point of the yr once more!
I really like these “state of” surveys (particularly the State of CSS 2026 survey, however I’m positive you understand that already). This yr feels totally different although, and I’m not the one one which’s seen.
From the opening crawl:
Take a deep breath. Settle down. It’s okay when you don’t know each single new CSS property. The reality is, only a few of us do.
Look, one in all this survey’s targets has all the time been to assist preserve builders updated on the newest and best CSS enhancements. However the draw back is that every one this progress can generally really feel overwhelming.
That’s why this yr we made a acutely aware effort to scale back the variety of options coated within the survey, focusing as an alternative on those that matter most.
I completely get it. It’s turning into an increasing number of troublesome to maintain up with CSS. My “issues to take a look at” checklist simply retains getting longer! That being stated, there’s by no means been a extra thrilling time to be a fan of CSS. That feeling while you be taught a brand new characteristic after which two extra get shipped, is overwhelming however in one of the best ways doable.
However nonetheless, time doesn’t develop on timber, so we’ve got to determine which options to put money into, and that’s what these “state of” surveys are all about. They usually’re going laborious this yr, actually zeroing in on a very powerful ones.
However, when you have an urge for food for all issues CSS, I hear there’s a nice weblog for that!
New net platform options
High quality over amount, I assume!
Till subsequent time.
