CSS

A 12-post collection

10–15 yrs ago CSS was mainly about cross-browser compatibility.
Today it’s all about components, state, transitions and JS. Still the same CSS, though.

»Aw, look at this beautiful cascade! Let’s build an awesome workflow on top!«
—No one. Ever.

Usually, once people found out the whole C in CSS, they start developing workarounds.

CSS issue: overflow-y: auto scrollbars not visible in Mac Chrome when on 2nd non-retina screen. Visible on main retina screen.
—WTF? 😠

(Took me 2.5 coffee to detect the cause.)

Sass vs. PostCSS? We'll go for a Sass basis because of its predefined feature set. PostCSS may transform shit later on.

Safari (OS X and iOS) seems to stumble on &shy; with several web fonts. Fixed it the tough way by using <i></i>&shy; for now. Well…

Safari issues with ­

If you read about BEM for CSS these days, stop thinking about classes and naming.
It’s all about inheritance.

Safari CSS hacks all around.
—Dear 2016, can you make things a little less dirty plz!

CSS code containing safari hacks

»When you write CSS, there is always context and you’re about to touch it!«

Read on: ‘Why BEM?’ in a nutshell

This is what my stylesheet source looks like when using postcss-import w/ globbing:

Globbing imports

Always missed globbing in Sass. With BEM you produce a lot of partials and don’t want to import every last one of them.