Skip to content
Vale.Rocks·

💻CSS's Wild History of Browser-Specific Hacks

CSS hacks and quirks you never knew existed

TL;DR

CSS has a history of browser-specific hacks like the star hack and !important bugs. These quirks were common in early Internet Explorer and Firefox, but most are now deprecated. Developers should be aware of legacy issues when writing cross-browser CSS.

CSS has a history filled with browser-specific hacks and quirks, like the star hack and !important bugs. These were common in early Internet Explorer and Firefox, allowing developers to target specific browsers with hacks like * html {} and html > /**/ body {}. However, most of these hacks are now deprecated, and developers should be aware of legacy issues when writing cross-browser CSS. For instance, Internet Explorer 6 treated properties prefixed with an underscore or hyphen as valid, while Firefox supported html > /**/ body {} for document-level browser detection. These quirks, though useful at the time, have since been phased out, making it crucial for developers to understand the history of CSS to avoid pitfalls in modern web development.

CSS's Wild History of Browser-Specific Hacks — Vale.Rocks

Key Points

1

Internet Explorer 6 treated properties prefixed with an underscore or hyphen as valid, a quirk now deprecated.

2

Internet Explorer 7 used *:first-child+html {} for document-level browser detection, a hack now obsolete.

3

Early Firefox supported html > /**/ body {} for document-level browser detection, a trick no longer needed.

4

CSS expressions, a non-standard feature introduced in IE5, allowed JavaScript execution in CSS but were deprecated in IE8.

5

Microsoft removed the -ms-filter property in IE10, signaling the end of bespoke filter functionality.

Why It Matters

If you're maintaining legacy web applications, understanding these CSS quirks is crucial. For instance, the star hack and !important bugs were once essential for cross-browser compatibility. However, these hacks are now deprecated, and modern browsers no longer support them. Developers must adapt their CSS practices to avoid compatibility issues and ensure their code remains maintainable in the long term.

cssbrowser-hacksweb-developmentlegacy-codecompatibility

Comments

Subscribe to join the conversation...

Be the first to comment

Enjoyed this article?

Get it daily. 7am. Free. Reads in 5 minutes.

Join 3,476 builders reading daily.

Also get