Posts in category css

31 Oct 2017

Forgotten CSS: Printing Your Website


I'm not sure many people think about how their websites look when printed. It's worth doing, not just for the print side of things but also PDF generation [and others?]

05 Sep 2017

Remove Unused CSS Rules


A monolithic style sheet is difficult to reason about, which is challenging as CSS files tend to attract bloat. Removing unused styles can help make the situation more manageable.

08 May 2017

Using lighten() and darken() in SASS


Until recently I didn’t know about the lighten() and darken() functions in SASS. I’ve since found them to be increasingly useful in my component building workflow. As the names suggest, given a colour and percentage, these functions will return a colour lighter or darker respectively.

26 Jul 2016

Neat uses for CSS’s awesome viewport units


CSS offers various units for sizing elements. The popular choices are px, %, pt, em and more recently rem. There are two other units that have quickly become favourites of mine, vw and vh. These are relative units, but unlike say em and rem which are relative to the font size of the current and root element respectively, vw and vh are relative to the viewport. A single viewport unit is equivalent to 1% of the viewport width (vw) or height (vh).

23 Apr 2016

The tilde CSS selector, use carefully!


A couple of the recent projects I’ve worked on have both had similar stylesheet problems. They have both misused the tilde selector, which has gone unnoticed and been the cause of numerous bouts of CSS bloat. You may well have come across this selector before. After all it’s a selector that’s been in the CSS spec for a long time, even IE7 supports it. Its purpose is to select all matching adjacent siblings.