Direct link to the article Responsive Designs and CSS Custom Properties: Defining Variables and Breakpoints

Responsive Designs and CSS Custom Properties: Defining Variables and Breakpoints

CSS custom properties (a.k.a. CSS variables) are becoming more and more popular. They finally reached decent browser support and are slowly making their way into various production environments. The popularity of custom properties shouldn’t come as a surprise, because …

Avatar of Mikolaj Dobrucki
Mikolaj Dobrucki on (Updated on )
Direct link to the article Why Browsers Download Stylesheets with Non-Matching Media Queries

Why Browsers Download Stylesheets with Non-Matching Media Queries

Direct Link

Say you have a stylesheet linked up like this:

<link href="mobile.css" rel="stylesheet" media="screen and (max-width: 600px)">

But as the page loads, you’re on a desktop browser where the screen is 1753px wide. The browser should just skip loading that stylesheet …

Avatar of Chris Coyier
Shared by Chris Coyier on

Responsive Comments

Direct Link

Meaning like <!-- these kind of comments -->. You put a media query in a data-* attribute of a parent element and it will determine if that block of commented HTML should be un-commented or not. A form of …

Avatar of Chris Coyier
Shared by Chris Coyier on (Updated on )

Transformer Tabs

Tabs are a simple design pattern in which a row of links are obviously clickable navigation and when a link is clicked, new content is shown. There are loads of variations of course, but it’s one of the most ubiquitous …

Avatar of Chris Coyier
Chris Coyier on (Updated on )