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 I have worked with for many years, and it has been a regular subject in my writing. There are twenty‑seven articles 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)CSS pseudo‑elements can use one or two colons. This guide explains `:before`, `::before`, modern syntax, compatibility, and when each form 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.
Bem and Sass for Component CSS. Bem and Sass for Component CSS
Use BEM and Sass together for component CSS with clear naming, shallow nesting, modifiers, reusable mixins, and less fragile front‑end styling over time.
Organising Sass with Partials and Mixins. Organising Sass with Partials and Mixins
Organise Sass with partials and mixins so stylesheets stay readable, reusable, easier to change, and less likely to hide component‑level side effects.
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.