Grow your CSS skills. Land your dream job.

CSS transparent background image hacks for IE6

  • # May 3, 2013 at 2:24 am

    Hi guys, i have a background image and text inside list item, so far i’m doing great. But when i tried to view it in IE6 the problem occured. My transparent background image are no longer transparent. So i did some hacks like this:

    li
    {
    background: url(image.png) no-repeat center
    _background:none;
    _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=’image.png’,sizingMethod=’crop’);
    }

    Transparent image problem solved! but the image is not on the center of the list item (i couldn’t set the fixed width and height for the list item since it contains text that is wider than the image)

    then i tried to put this hack from microsoft website:

    _filter:progid:DXImageTransform.Microsoft.Fade(center = ‘true’);

    but still no use.

    Could anyone please tell me what should i do to solve this?
    Greatly appreciate it. Thanks in advanced.

    # May 3, 2013 at 5:41 pm

    Have a look at http://www.dillerdesign.com/experiment/DD_belatedPNG/

    This may be a silly question to ask, but why are you developing for IE6 when it’s pretty much got no browser usage share? http://www.ie6countdown.com/

    # May 4, 2013 at 1:04 am

    well i just want to build the web which are compatible to most of all browsers out there :)

    anyway thanks jamy for your links.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".