{ CSS snippets }

Wes Bos

Wes Bos @wesbos

🔥 CSS variables can be set to other CSS variables. Also we will soon be able to tweak colours with colour functions in CSS directly. Good for Canadians who can never remember which way to spell grey https://t.co/oqn74uDF4g

CSS
Ben Furfie

Ben Furfie @frontendben

Here's a really neat trick I always use in all my #tailwindcss powered sites. Need to make you <p> tag white but don't want to add text-white to every tag? You don't have to. Simply leverage the power of color: inherit. https://t.co/cfkoCb487k

CSS
Tyler van der Hoeven

Tyler van der Hoeven @tyvdh

Today I learned about `font-variant-numeric: tabular-nums;` Basically makes a text value act like monospace so when you’re scaling it up and down via a slider etc. it doesn’t jump around as much. https://t.co/2nb9ym3Khf

CSS
Wes Bos

Wes Bos @wesbos

? Did you know CSS has a `turn` unit? It’s often easier to turn something `rotate(0.75turn)` instead of doing the math to `rotate(270deg)`

CSS
Wes Bos ?

Wes Bos ? @wesbos

Two things I’ve been doing lately: 1. using aria-attributes in my CSS to dictate different UI states. (aria-busy for loading, aria-expanded for open/closed navs) 2. Disabling an entire <form> during loading states by wrapping in a fieldset. Using CSS to add loading animation https://t.co/rW1uRNK8eG

CSS
Achraf Kassioui

Achraf Kassioui @achrafkassioui

CSS tip: the <main> element isn't recognized as a default block level element in Internet Explorer. Set it to display: block in CSS so IE can display it correctly.