Download free css hacks and issues in Adobe PDF format
1. Introduction
This article includes 8 helpful solutions which we find essential when designing with CSS
2. Browser-Specific selectors
These selectors are very useful when you want to change a style in one browser but not the others.
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 {}
Safari
html[xmlns*=""] body:last-child {}
To use these selectors, place the code in front of the style. E.g.:
#content-box {
width: 300px;
height: 150px;
}
* html #content-box {
width: 250px;
} /* overrides the above style and changes the width to 250px in IE 6 and below */
3. Transparent PNG’s in IE6
An IE6 bug which causes a great deal of hassle is that it doesn’t support transparent PNG images.
You will need to use a filter which overrides the CSS.
* html #image-style {
background-image: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src="filename.png", sizingMethod="scale");
}