CSS, Snippets

CSS Hacks (for IE 7, IE 6, Opera, etc)

The following CSS selectors are considered workarounds and hacks for specific web browsers.

IE 6 and below
* html {}
IE 7 and below
*:first-child+html {} * html {}
IE 7 only
*:first-child+html {}
IE 7 and modern browsers only
html>body {}
Modern browsers only (not IE 7)
html>/**/body {}
Recent Opera versions 9 and below
html:first-child {}

Source: CSS Hacks

Usage
If you want to add 5px padding to a div element called #comments specifically for IE 7, then you can use the following hack:

*:first-child+html #comments {
padding: 5px;
}

But if you want to apply the padding just for IE 6, then the following will do the trick:

* html #comments {
padding: 5px;
}

Note that CSS Hacks are not recommended due to their dependence on browser bugs and therefore they should only be used as the last resort.

A more comprehensive article on CSS Hacks can be found here.

[tags]css hacks, hacks, css, browsers compatibility, design, front-end[/tags]

Twitter
LinkedIn
YouTube
Instagram