IE8: after ,: before the opacity error

In Internet Explorer 8, it seems that pseudo-elements do not support opacity:

Example:

# div:after  {
   content: '';
   background: red url('pattern.png') no-repeat left top;
   position: absolute;
   top: 0;
   left: 0;
   height: 300px;
   width: 300px;
   opacity: 0.10;
   filter: alpha(opacity=10);
}

Does anyone know how I can fix this, so I have a template with opacity 0.10.

+3
source share
1 answer

The property filteronly works for IE5-7, in order to maintain opacity in IE8, you will need to use the following:

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";

see the full link to this CSS-Tricks code snippet for cross-browser opacity .

+1
source

All Articles