Consider Blocking CSS By Default

Mar. 22, 2023 [technology] [privacy-security] [advertising]

You may be running some hotrodded addon suite that blocks the various attack vectors which the modern web likes to throw at you. But are you blocking quite enough? A colleague and I exchanged thoughts on the best defaults for which web resources to deny and he was surprised to learn that I even strip the style sheets (CSS) out of visited web pages.

CSS is commonly thought to be useful just for formatting and for the basic beautification of web pages. But it can be capable of so much more. That last link is innocent in nature, but demonstrates a point. Consider also that CSS can be used, as demonstrated by Davy Wybiral, to break up a page into a hidden grid with :hover selectors, which can then be used to remotely monitor the position of visitor’s cursors. All without the involvement of javascript and all without the browser reporting any network requests.

Wybiral highlighted some use cases for this:

If you think that sites would have no interest in conducting such focused tracking, please know that there is an entire industry catering to capturing “session replays”. Complete recordings of each visitor’s time on the site, obstensibly to “improve” the UI. But why would session replays need to capture keystrokes and, by extension, possibly passwords to “improve their UI”? They are willing to use everything down to DOM events. Would they not find CSS-based tracking useful? Especially considering how popular javascript-blocking has become?

Similarly, it had been possible to fingerprint and gather a visitor’s related browsing history through the :visited selector. Browsers have since implemented mitigations (spoofing values) but there remain so many other ways to fingerprint users through CSS. Such as techniques using background images or fonts, in which the browser is instructed to request a completely unique asset from the site server. Oliver Brotchie elaborates:

This technique avoids anti-tracking methods such as NoScript, VPNs or browser extensions, as it requires no Javascript or Cookies to function.

Or such as by gathering canvas information, browser information and other metrics, for which author ‘jbtronics’ explains the only possible defenses:

What you can do to prevent tracking with this method? … is to disable CSS for a web page completely, you can do this via browser settings or with plugins like uMatrix (currently unmaintained), CSS Toggler (currently unmaintained), Stylus or uBlock.

Or exfiltrating user input (and doubtlessly more to come!). Mike Gualtieri, who penned these methods, refers to extensions as a possible defense:

Defense for Web Users. For web users the best defense is to ensure that such malicious CSS is not parsed by your browser. As such, I developed a pair of browser plugins for Chrome and Firefox which aim to protect against CSS Exfil attacks. … Each plugin works by pre-processing the CSS which is loaded onto a web page. Inspection and sanitization of each CSSRule is done through the browser’s native CSSStyleSheet JavaScript API. If a CSSRule.selectorText is detected that: 1) Parses the value attribute of an element, and 2) If the corresponding CSSRule.cssText includes a call to a remote URL, a new rule is created to override the call to the remote URL.

Just a quick note: The CSS Exfil Protection Addon currently leaks requests for 3rd party stylesheets from behind blockers like uBlock Origin.

If you have the time, please consider reading through, in full, the excellent material that these researchers have produced. As the style sheet standard continues to get extended, we can only anticipate that the attack surface it presents will follow suit. At this point, I don’t trust anything without at least some layer of isolation and verification.

I suggest simply blocking CSS outright. It really isn’t much of a nuisance considering the majority of the time one spends on the web is just reading text. With style sheets stripped away, some sites will render large SVGs that fill your screen. You can either disable SVGs (in Firefox derived browsers that is at svg.disabled=true) or just scroll down to about 80% to the bottom and the textual content can almost always be found there. I basically only ever enable CSS on sites which I have used for a long time and have built a trustworthy rapport.

I have also found that CSS is one of the ways in which some websites will try to obscure their page in an attempt to punish visitors who block javascript. No CSS, no problem!