A while back I wrote a set of Vue 2 components for a WordPress blog. It wasn't a complete project, was missing functionality that I couldn't figure out how to implement and I was afraid it would lock...
CSS layers resolve another problem with CSS specificity and rule order. as I documented in: Looking forward: CSS Layers and the @layer at-rule CSS Layers or Cascade Layers are a way to group styles...
In the past, we've had to write media queries that check for screen/device width as something like this. This query checks if the screen has a minimum width of 768px @media (min-width: 768px) { ...
Warning: This feature is only supported behind a flag in Chromium browsers since version 85 and, as far as I know, there is no polyfill. Do not use this feature in production. The...
Of all the new features the one I've been researching is @custom-media. Custom media queries allow you to create, in essence, create variables in CSS where we associate a name with a media query and...
The color-contrast() CSS function checks the contrast between two colors, usually a background color and black or white text. At its simplest, color-contrast() works like this: We first set up a...
There are a lot of interesting color features in CSS that are either under development, have recently been implemented in browsers, or are in development in one or more browsers. New color spaces...
I'm starting to work with interviews. I would like to be able to get the audio transcribed to text and then store the text and the metadata about the interview in a no-SQL/non-relational database that...
In a previous post, we looked at the top accessibility issues reported in the WebAIM Million 2022 report, how to create accessible content, and how to test and repair accessibility errors. In this...
The WebAIM Million report presents a sad state of where the top one million websites on the web from an accessibility perspective. Even if you're not working on a top one million website, the lessons...