Today’s Readings

The View Transitions API is absolutely fascinating me… I cannot wait for better browser support… This will be such a game-changer for the web! Here are several articles and examples:

And speaking of examples of “what is possible”, demonstrates all the fancy features a PWA can do today!

Thanks to for this very clever HTML+CSS only “tree view” list. Basically, nesting uls within details within uls… then using some fancy CSS to make it look awesome… And NO JS!

Sticking with CSS for another second, shares this nice walk-through for creating a skewed background highlight using nothing but CSS.

Okay, just one more CSS… writes about some Lesser-Known And Underused CSS Features. You will likely know some, but some stand-outs for me are all (really like all: unset; within a specific selector!), currentColor (have used this a lot, but still forget about it!), Interaction Media Queries, isolation (Wow!), and, oh… scroll-padding

Somebody help me, I can’t stop… I think most of us probably at least familiar with the concept of CSS Logical Properties by now, those super-efficient new ways to define block, inline, direction, etc., so that it works in ltr and rtl reading environments? If not, will help get you up-to-speed. If so, it also works as a really nice cheatsheet!

Overlapping elements. We’ve all seen it, text over images or videos or graphics, and most of us have had to build it, typically absolutely-positioning something over something else, and always with some level of fragility at some breakpoint. But offers another approach by overlapping elements using display: grid!

And while we’re creating responsive components, let’s make sure our content is responsive by using this this clamp() calculator from !

And while we’re getting our responsive content in order, why not let help us get our vertical spacing straightened out, too?

And heck, why not let help us combine Custom Properties and responsive content with his Stack and Flow tips.

offers a thorough explainer on fetchpriority and how it can help LCP. The key that I think a lot of people miss regarding fetchpriority is that it doesn’t change the priority to “high”, for example, but requests it be higher than the default.

And shares a few more tips for getting your LCP in front of your users more quickly

Here is a slick accessible hamburger menu button that requires no JS. I would have added cursor: pointer to the label, but I realize this is mostly intended for touchscreens. Love it!

shares a couple of really useful form attributes we should all be adding to help our users. And if you are doing two-factor authentication, please take note of autocomplete="one-time-code", so the browser can offer to prefill the code once the text arrives. Also be sure to click through to the Phil Nash article that Jeremy links to to improve your two factor authentication experience.

And finally, offers his Debugging Tactics, a slightly tongue-in-cheek look at how best to approach our daily task of debugging something…

Happy reading,

2 Responses to Today’s Readings

  1. Alex Ivanovs says:

    Thank you for mentioning, Aaron.

    I’ll fix the images in the JSFiddle, it seems the Picsum photos have expired.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.