CSS Injection Can Now Steal Data with Just One Line of Code
PortSwigger researcher Gareth Hayes has unveiled a novel technique for stealing data directly from HTML attributes using inline CSS, without relying on selectors or external style sheets. The discovery was made possible by the introduction of conditional if() expressions in Chromium-based browsers.
The method exploits a combination of the attr() and style() functions, enabling the evaluation of attribute values and, depending on the result, the triggering of background requests to a chosen domain. In this way, attackers can “brute-force” potential values and extract simple data—such as user IDs or names—even in environments where JavaScript injection is blocked.
This approach builds on earlier work by Slonser, which required loading an external stylesheet to exfiltrate information. Now, the attack can be executed in a single line within a style attribute, with comparisons functioning only when double quotes are used. Later testing revealed that even url() was unnecessary for the request—further simplifying CSS-based exploitation.
To automate value extraction, Hayes employed a custom Burp Suite action that generated ready-to-use HTML payloads. For now, the technique functions only in Chromium browsers.
Experts caution that the advent of conditional expressions in CSS makes the language significantly more versatile, but also expands the attack surface for CSS injection. To defend against such exploits, developers are advised to block untrusted inline styles, sanitize the style attribute, enforce a strict Content Security Policy (CSP), and rigorously validate the values of data- attributes.
The full research, along with practical examples, has been published on the PortSwigger Research blog.
Support Our Threat Intelligence
If you find our technology report and cybersecurity news helpful, consider supporting our work.
Buy Me a Coffee
PayPal
