Not signed in (Sign In)
SkillShare - A place to discuss Web Standards and Web Design topics
Categories
Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.
- Friends
-
- CommentAuthordmitryseliv
- CommentTimeFeb 18th 2008
Hi Does anybody knows any method to fix png problem in IE6 which actually works.
There are several of them out there but I need the one that can applied to the
div or class that contains background image.
example:
.frame {
padding:30px;
background: url('../images/frame.png') no-repeat 4px center;
}
Cheers, DS -
-
CommentAuthorbenjitastic
- CommentTimeFeb 18th 2008
Hi,
I have used the AlphaImageLoader Filter in the past.
This one will stretch the background image to the size of the element:.frame {
background: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/frame.png', sizingMethod='scale');
}
This one will maintain the actual size of background image:.frame {
background: none;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/frame.png', sizingMethod='image');
}
I'm not sure about positioning the background image - you'd have to play around with it. Also, the CSS does no validate. -
-
The best fix I know of is:
http://24ways.org/2007/supersleight-transparent-png-in-ie6
This uses Javascript to apply the same method as above but without having to use CSS. It can also be used for background images and customised for background types if you alter the source, although works best for standard PNG's. -
Indeed, however... If you put the CSS into an ie.css stylesheet and use conditional comments to reference it, then the validator will ignore that stylesheet as the validator is not IE. Therefore, your CSS will appear valid :)Also, the CSS does no validate.
example:
http://www.growldesign.co.uk/iecc/index.html
Validation:
http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.growldesign.co.uk%2Fiecc%2Findex.html&warning=1&profile=css21&usermedium=all
1 to 4 of 4