Picks

Recently implemented in Chrome are two of my top asks for CSS—the concept of rows in multiple-column layout, and gap decorations for rows and columns in grid, flexbox, and multicol. Rows (using column-wrap) provide a way to use multicol on the web without risking scrolling up and down to read…

Sidney Paget illustration of Sherlock Holmes from Strand Magazine, December 1892, p.646, but I added papers from his March 1893 (p.281 of Strand Magazine) illustration and then two versions of the W3C logo to the front page. When performing a WCAG evaluation (or review or audit), it’s easy to get…

Making and breaking grids I’ve been doing more front-end coding this year than I have in a while and every time I come back to write markup and CSS, it feels like there are new tricks. We’re closing in on the 30th anniversary of CSS (already a little past 30…

This is the second of two parts on media creation. You can find the first part over here: Creating media with an uncooperative mind Infinite negatives # In trying to figure out what I should write and talk about, I could spend the rest of my life outlining all the…

The <geolocation> HTML element does exactly what you might think it does. It’s a dedicated element that gets the user’s location, either once or continuously. The options are set using HTML attributes instead of JavaScript, but JavaScript is still needed. However, <geolocation> requires fewer lines of JavaScript and also offers…

Highlighting in CSS has been beneficial for applying a highlight on specific text or text fragments during user selection, emphasizing a piece of information on a website, or visually emphasizing a text for the sake of branding. Particularly, this is pretty helpful when users want to scan your document from…

I made a smol client-side syntax highlighter that uses the CSS Custom Highlights API called MicroLighter. I’ll talk about why I made it in a bit but first I wanted to… ahem… highlight… some of the features. Zero-dependencies ~2kb minifed+gzipped Uses CSS ::highlight(token-name), not spans Leverages Textmate’s language grammars Human-readable…

Every element I use for the basic structure of a HTML document, with explanations why.Five years ago, I shared the HTML boilerplate I use for most of my projects. Since then, a lot has happened in HTML. It’s time to give it an update. My boilerplate This is the final…

Recently, I watched a video by Colin & Samir speaking about a situation Hank Green is currently facing. Hank was recently accused of using AI in a video script because he said the words “I appreciate the pushback.” Hank went on to address not only that particular video but also…

Customizable select is coming to Safari 27. With this technology, developers can fully control the appearance of <select> elements — custom arrows, option layouts, color swatches, icons, full visual styling — without the need for JavaScript libraries or an endless parade of <div> elements. And because it’s a built-in control,…