Item Flow, Part 1: A new unified concept for layout

if-bfrw\[auto\ 24px\]

see, a full masonry layout using just one CSS class!

That’s what Microsoft said about IE6.

You can put 4 divs side by side in many ways, then jut put images in it.

I tend to agree, but have softened on this, not only but also because of the handy devtools feature to expand them.

I do use them for margin, padding, inset.

Others I dislike a bit, for example I hate the one for background whenever things get complex. Others I don't like, but have become used to, for example the "flex" shorthand. I prefer separate flex-grow, flex-shrink and flex-basis properties.

Downside (and sometimes, intended upside!) to all of them is how they interact with inheritance and the cascade, i.e. accidentally overriding properties. OTOH it can prevent you from forgetting to override inherited properties.

Since the properties for which a shorthand exists often are closely related, this can be an upside.

The one in the article I still have to digest.

One neat thing about them is that you can combine, for instance, all font-* properties into a single variable for reuse.