Skip to main content
CSS is fun and cool and I like it.

Multi-Line Inline Gradient

Came across this thread:

My first thought process was:

But it turns out we need a litttttle extra trickery to make it happen.… Read article “Multi-Line Inline Gradient”


Decorating lines of text with box-decoration-break

An institution’s motto, an artist’s intro, a company’s tagline, a community’s principle, a service’s greeting… all of them have one thing in common: they’re one brief paragraph displayed on a website’s home page — or at least the about page!

It’s rare that just one word or one line of text welcomes you to a website. So, let’s look at some interesting ways we could style the lines of a paragraph.… Read article “Decorating lines of text with box-decoration-break”



The box-decoration-break property lets you control how box decorations are drawn across the fragments of a “broken” element. An element can break into fragments at the end of a line, over columns, or at page breaks.

.module {
  box-decoration-break: clone;

The box decoration properties controlled by box-decoration-break are: background (and its sub-properties), border, border-radius, border-image, box-shadow, margin, and padding.

  • slice: the initial value. Box decorations apply to the element as a
Read article “box-decoration-break”