IE hack for semi transparent background

  • Hi,

    I am using RGBA to get a semi transparent background,
    it works in most browsers but not IE. Here is the
    code.

    #wrapper {
    background: rgba(0, 0, 0, 0.8);
    }

    To fix the IE problem I am using a hack by adding the
    following to the header.php file, immediately after the
    stylesheet call.

    <!–[if IE]>
    <style type=”text/css”>
    .color-block {
    background:transparent;
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50000000,endColorstr=#50000000);
    zoom: 1;}
    </style>
    <![endif]–>

    Any help would be greatly appreciated?

Viewing 2 replies - 1 through 2 (of 2 total)

  • What’s your question?

    If all you’re trying to do is give an element a transparent background, can you just resort to a png for unsupported browsers?

    /* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) url(your.png) top left repeat;
/* RGBa with 0.6 opacity */
background: rgba(33, 144, 8, 0.6);

    Thread Starter carterkay

    (@carterkay)

    That’s a much easier way of doing it,,
    tried it and it works fine..

    One question, why do you set rgb(0, 0, 0),
    does it effect the png file?

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘IE hack for semi transparent background’ is closed to new replies.

Tags