A blog about web development, HTML, CSS, JavaScript, and web accessibility.

Day 90: scoped styles in container queries

Rules within a container query only apply to descendants of that container.

Day 89: higher-order custom properties

Style queries may change the way we write CSS significantly.

Day 88: CSS Motion Path

CSS Motion path allows you to position any graphical object and animate it along a specified path.

Day 87: mask properties

You can use mask properties to apply a mask to an element.

Day 86: the initial-letter property

The initial-letter property specifies size and sink for initial letters.

Day 85: typed custom properties in container style queries

Registering typed custom properties can be useful in container style queries.

Day 84: the @property at-rule

The @property rule allows you to register custom properties.

Day 83: computed values in container style queries

On day 80, I’ve explained that we can check whether a container has a specific property and value assigned and apply additional styles based on this condition. On day 82, I’ve explained that the value of a property can come from different sources, undergo adjustments before it becomes the actual value, and take on different forms along the way. To use container style queries, it’s important to understand which value's being used in queries.

Day 82: value processing

This post differs from most of the other posts because it’s not about modern CSS, but about CSS fundamentals. When I was writing about custom properties and especially about container style queries, I realized that I had to understand some of the basics of the language first before I could comprehend how certain properties and rules worked.

Day 81: the order of individual transform properties

On day 66, I’ve introduced you to individual transform properties. An interesting detail about these properties is the order in which transforms are applied compared to the transform property.