Hiding Empty Elements with CSS
Hide empty elements with the CSS :empty pseudo‑class, including strict matching rules, whitespace caveats, supported selectors, and practical UI uses.
Articles
Sass, page 2 of 2
Sass (Syntactically Awesome Stylesheets) is a preprocessor scripting language which is compiled into CSS (Cascading Style Sheets). Although the CSS standards are generally starting to catch up now, what Sass offers that conventional CSS lacks is the likes of variables, mixins, and functions, making CSS more maintainable and extendable.
Below you will find a subset of articles from my blog specifically about Sass. This is an area that I have worked with for many years, and have managed to write about quite a few times. There are twenty‑five collected together for you below.
Hiding Empty Elements with CSS. 
Disabling Text Selection Highlighting with CSS. Disabling Text Selection Highlighting with CSS
User‑select makes stopping visitors from selecting items on‑page easy, and can be combined with ::selection to capture the browsers where user‑select is absent.
Alternative Text in the CSS content Property. Alternative Text in the CSS
contentPropertyThe 'content' property in CSS is often used to insert graphical elements which ‑ on their own ‑ do not have an accessible alternative text available.
Single or Double Colons in CSS Pseudo‑Elements (:before vs. ::before). Single or Double Colons in CSS Pseudo‑Elements (
:beforevs.::before)In CSS, pseudo‑elements can be written with one or two colons (e.g., `:before` or `::before`). Here, I explain the difference, correct usage, and why it matters.
Using Viewport Units in CSS: vw and vh. Using Viewport Units in CSS:
vwandvhUse CSS viewport units vw and vh for responsive sizing, understanding percentage‑of‑viewport behaviour, full‑screen layouts, and mobile browser caveats.
What are CSS Preprocessors, and Why Should You Use Them? What are CSS Preprocessors, and Why Should You Use Them?
CSS preprocessors like Sass and Less enhance standard CSS with features like variables and nesting. Here, I explore their benefits and why they're essential.
!important in CSS. !importantin CSSUnderstand why !important in CSS creates cascade, specificity, consistency, and maintenance problems, plus when an override may still be defensible.