✳flâneur — a map of the web's best reading

The CSS Cascade

2019.wattenberger.com · 4,137 words · saved by 1 readers

We style our websites using CSS, which stands for Cascading Style Sheets. But what does Cascading really mean? The CSS Cascade is one of the most powerful parts of CSS. But it can also be very frustrating, if not well understood. Anyone who’s worked on a large enough website has complained "Why won’t this CSS property work?!" And we’ve all been tempted to throw an !important to strong-arm things into place. To save ourselves from future angst, let’s take a step back and learn this thing for real. Every time we write a CSS declaration (or rule), it will enter the CSS Cascade, which will determine whether or not it will end up as the final style. The further down the cascade a declaration falls, the less likely it will end up as the final style. Let’s take a look at the different tiers of the Cascade. The first tier of the Cascade looks at the type of rule we’re looking at. There are four basic types of rules: 1. transition Rules that apply to an active transition take the utmost importa

could not be decoded. This is likely caused by an invalid percent-encoding.'):a}return e&&(o.key=e),i?o.pathname? /> elements are self-closing and can not contain children. Refer to our API for more information. Invalid attempt to destructure non-iterable instance. In order to be iterable, non-array objects must have a [Symbol.iterator]() method. ),console.warn(' This means you can ignore any previous messages of the form mousedown mouseup touchcancel touchend touchstart auxclick dblclick pointercancel pointerdown pointerup dragend dragstart drop compositionend compositionstart keydown keypres

Explore this link on the map →

related reading