Articles

Featured Articles

You can find me as a writer on Smashing Magazine, CSS-Tricks, ModernCSS, 11ty Rocks, and DEV. Here is a selection of tutorials and articles I'm most proud of, and that have also received appreciation from the wider community.

• Unleashing the Power of CSS

  

  In this premium SitePoint series, we'll review CSS enhancements to layout, responsive design, element styling, properties, and selectors, and also peek at upcoming features; deep-dive into using the CSS :has() selector for scaling reusable components; discover the practical uses of container queries; and learn how to create responsive CSS layouts without using media queries.

• Level Up Your CSS Skills With The :has() Selector

  

  The CSS relational selector :has() allows selecting elements in combinations that were previously impossible without the assistance of JavaScript. Review how to combine :has() with core CSS selectors to extend their capabilities.

• Getting Started With CSS Cascade Layers

  

  Within 2021, a new spec to orchestrate the “C” in CSS was drafted and is now an official candidate recommendation: cascade layers. Learn more about layers and how to use them.

• A Primer On CSS Container Queries

  

  Look at what problem is being solved, learn how container queries work, and see how they compare with and complement existing CSS features for layout.

• Contextual Spacing For Intrinsic Web Design

  

  Learn how to coexist with the unpredictability of the browser by using adaptive, contextual spacing techniques. We'll construct a starter set of custom properties for gap, margin, and padding.

• CSS Scroll Snap Slide Deck That Supports Live Coding

  

  With a bit of creativity using native web functionality and modern CSS, like CSS scroll snap, we’ll be building a no-JavaScript slide deck that allows live editing of CSS demos.

• A Guide to CSS Debugging

  

  Debugging in CSS means figuring out what might be the problem when you have unexpected layout results. We’ll look at a few categories bugs often fit into, see how we can evaluate the situation, and explore techniques that help prevent these bugs.

• A Guide To Newly Supported, Modern CSS Pseudo-Class Selectors

  

  This guide will cover CSS Level 4 pseudo-class selectors that currently have the best support along with examples to demonstrate how you can start using them today.

• A Community-Driven Site with Eleventy: Building the Site

  

  Develop an Eleventy setup that you can use as a starting point for your own community (or personal) site.

• Guide to Advanced CSS Selectors - Part One

  

  Understanding selectors, the cascade, and specificity are critical to developing CSS and modifying existing style rules. This two-part guide about advanced CSS selectors includes practical examples.

• Custom Select Styles with Pure CSS

  

  Modern CSS gives us a range of properties to achieve custom select styles that have a near-identical initial appearance for single, multiple, and disabled select elements across the top browsers.

• Going Beyond Static Sites With Eleventy

  

  Eleventy includes features that allow exceeding the traditional limits of static. Learn how to leverage these features and think beyond static when using Eleventy.

• How I Built and Launched A Small Web App in 17 Hours

  

  This reflection post reviews the tech stack used, reveals a few tricks, and provides some techniques for how to rapidly go from idea to launch for small projects.