1

i knew rgba will not work in ie8 browser. how can i solve this.

please refer below html

<html>
<head>
<style type="text/css">
body
{
background-color:black;
}
.navitem
{
color:red;
}
.navitem:hover
{
 background: rgba(255, 255, 255, 0.3); /* browsers */
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#4cffffff', endColorstr='#4cffffff'); /* IE */

}
</style>
</head>
<body>
<a class="navitem">Hot Alerts</a>
</body>


</html>

i googled and found the solutions in below link and i tried use that solution but still not working. what is the exact problem how can i solve this.

the below link i referred.

CSS background opacity with rgba not working in IE 8

Thanks,

Siva

Community
  • 1
  • 1
SivaRajini
  • 7,225
  • 21
  • 81
  • 128

2 Answers2

4

You can either use a .png as a background image, or just set a solid color fallback for IE8. The fallback would work like:

.navitem:hover {
    /* solid color fallback */
    background: rgb(100,100,100);
     /* modern browsers */
    background: rgba(255, 255, 255, 0.3);
}
kthornbloom
  • 3,660
  • 2
  • 31
  • 46
  • is there any example avail ? – SivaRajini Jan 09 '14 at 14:42
  • See my update. The first color declared will not be transparent, but is only used for IE8 and below. You can adjust it to look as close as possible to the transparent color. All modern browsers will get the second value with the transparency. Or, if you want to use the png method, just create a white png at 30% opacity and call it as your background image. This will work back to IE7 I believe. – kthornbloom Jan 09 '14 at 14:58
1

i use this site to generate the rgba for IE 8 and works: http://kimili.com/journal/rgba-hsla-css-generator-for-internet-explorer/

please try. type at first field like this: "rgba(0,0,0,0.5)" the output is your code for use in IE

Joe RR
  • 262
  • 3
  • 22