23

I'm a moderator at a forum. We want to have a new style for the forum. We're thinking about announcing a competition to the users to come up with the best CSS design; we would adopt the best submission.

How dangerous would this be? How dangerous is it to use CSS styles from someone we don't trust? Is it possible for a CSS designer to add a malicious code or function to the CSS style itself?

1
  • 4
    Theoretical attack: someone uploads a style entry that makes the "post new thread" page look like a "provide login credentials" page. The attacker tricks a user (or admin!) into visiting this page and entering their username and password, which get publicly posted to the site. Furthermore, the attacker could immediately use those credentials to delete the post and hide her activity, if she so chose.
    – apsillers
    Jan 15, 2013 at 20:48

3 Answers 3

25

It is not advisable to use CSS styles from a source you don't trust, without some sort of review.

There are some risks, particularly on older browsers. Some older browsers provide a way to embed JavaScript inside of CSS, so that the JavaScript will be automatically executed as soon as the browser loads the CSS. Browsers with this problem include IE6, IE7, as well as later versions of IE in IE7 compatibility mode; also IE Mobile 8. (In those older browsers, this is supported through CSS constructs like url, expression(...), behavior, -moz-binding, -o-link, and probably more.) This weakness of older browsers allows an attacker who supplies malicious CSS to do anything an XSS attack can do. Using CSS styles from an attacker is basically a self-inflicted XSS vulnerability.

Fortunately, modern browsers have closed all of these JavaScript pathways. Unfortunately, some users still use older browsers, so if you use CSS from an untrusted source, you'll be putting those users at risk.

That said, I would recommend taking a risk management perspective. How great is the risk? How great is the benefit? In this case, I suspect the benefits are probably worth taking a slight risk, particularly if you adopt some mitigations to protect yourself. I would recommend:

  • Review all of the proposed CSS before loading it into your site. Make sure you understand it, and it isn't obfuscated. Make sure it looks clean and well-organized and readable. Make sure it doesn't load external CSS or other external resources. See whether it looks reasonable to you. If you spot it doing stuff you don't understand, maybe don't use it.

  • Check the source. Are they a trusted user of your community, who have been spending time on your site for a long time? Or are they a new user who you have little history of? There's probably less risk from a trusted member of the site, and more risk from an unknown.

If it were a site I was running, I'd probably do it. Yes, I'd use the above mitigations to protect myself -- but I wouldn't let security get in the way of having fun things.

Other resources: CSS security, from ha.ckers, Ending expressions, from MSDN

4
  • So it might put users with old browsers under risk ... ok what about the web server ??
    – HSN
    Nov 18, 2012 at 22:32
  • 2
    @HSN, There's no risk that it would allow the web server to be compromised.
    – D.W.
    Nov 18, 2012 at 22:37
  • 5
    The XSS might be able to hijack an admin account, which depending on the circumstances might allow compromizing the server in some way. Nov 18, 2012 at 22:50
  • 1
    One important restriction could be that the custom CSS is only displayed to logged-in users, and only those without administrator (or similar) privileges. May 6, 2013 at 16:56
8

One tiny addition to comprehensive post of D.M.

CSS2+ can also manipulate text on the page. See MDN for content CSS property details and this for examples.

Compare this behaviour to expression() javascriptlets in IE6 CSS: in both cases CSS is performing smth more than just styling... Pity, this is a part of CSS standard.

1
  • To be exact, property content can be used to add content on the page, not to modify existing content. Jun 21, 2021 at 12:08
1

In addition to allowing potential attacker to fake the user interface to look like something else (e.g. make new forum message form look like login form) there's a possibility of side-channel data leak to external service.

Some example attack vectors:

In short, CSS can be used to make some part of the page intentionally computationally heavy for some specific data on the page. This can be used to (slowly) leak bytes or bits of e.g. CSRF secrets.

It's also possible to subset fonts to single letters and get remote server ping for every new letter typed in some form input. Or to fetch different background image for any initial letter in form input. And in some cases (not often possible because @import must be at the start of CSS and browsers often stall page rendering before response is received), the @import can be used as a parallel communication channel where long-poll is used to allow page to render and only then generate new attack CSS on the fly when additional side-channel leak data is received.

I believe that to be fully safe you need CSS parser with whitelist of acceptable selectors, properties and functions to be used. We're running an in-house parser for incoming user CSS and we have max limit of 50 @media rules, 10 @font-face rules and 25 attribute selectors. @import is only allowed from specified trusted URLs. In addition, only whitelisted properties and values are allowed.

Then there're some corner cases that I don't know if they are totally safe or not. See Is it safe to allow CSS filter: url(data:<SVG SOURCE HERE>)? for an example.

I wouldn't consider any old browsers which have non-standard extra attack vendors using CSS because those are vulnerable to so many known attacks that there's no point trying to guard them.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.