Neither Chrome, Safari, nor Firefox have shipped new features in the last couple of weeks, but fear not because leading this issue of What’s !important is some of the web development industry’s best educators with, frankly, some killer content.
Powered by
DigitalOcean
The new ::search-text pseudo (Chrome 144) matches are yellow while the current target (::search-text:current) is orange, but ::search-text enables us to change that.
Stu Robson’s ReliCSS (clever name!) tool can excavate outdated CSS in your codebase that have modern CSS solutions.
Accessibility advice around modals have commonly taught us to trap focus within the modal. Upon further research, it seems like we no longer need to trap focus within the <dialog> (even in modal mode).
A while back, Temani tacked a repeating grid of hexagon shapes. Well, he’s updated it with modern CSS features that result in fewer magic numbers. And it’s impressive!
The @custom-media at-rule has landed in Firefox Nightly! I couldn’t find it in the release notes but Adam Argyle’s on […]
.element { view-timeline-axis: x; /* horizontal axis */ }
.element { view-timeline-inset: 200px 20%; }
.element { animation-range: cover; }
.element { filter: blur(5px); }
.element { corner-shape: superellipse(2); }
.element { corner-shape: scoop; }
.element { rotate: asin(-0.5); }
.element { rotate: acos(0.5) }
.element { rotate: atan(1); }
.element { rotate: atan2(200px, 200px); }
.element { background-image: cross-fade(url(a), url(b)); }
