CSS

`box-decoration-break: clone;` in CSS can help us make for interesting backgrounds across lines of text that break, but when opacity gets involved, things can get complicated.

Blue links with underlines is a good default style for links in body text, but it’s a bit intense. Maybe we can chill it out a bit and be a bit more flexible.

This post starts with quite a tricky little quiz about what a color value resolves to be.

Seriously almost every “menu” and “tooltip” could and should use this when it’s ready.

You can pluck off values from HTML attributes that actually have types now, so if you put data-font-size=”2.2rem” on an element you could actually, ya know, honor that.

::selection is cool, but scoping it to selectors like :nth-child(5n+2) is even more fun, especially on a love filled ay like Valentine’s Day.

The & is a powerful addition to CSS, allowing us to craft selectors without repetition and helping organization and understanding.

The typical approach for these inputs is using multiple HTML inputs, one for each character. But is that a good idea?

Just four declarations in CSS can handle this nicely, while avoiding the vertical scrollbar issue.

We’ll get into layered content, clip-path, and the :has() selector to build a responsive slider with live videos. We can do it by hand, but a few SCSS loops will help make it more manageable.