0

IE8 fails to apply some property for no apparent reason.

Giving this HTML : 

<html>
    <head>
        <style type="text/css">
            h1:after {
                position: absolute;
                content: "test";
                top: 20%;
                left: 20%;
                background: red;
                filter: alpha(opacity=65);
            }
        </style>
    </head>
<body>
    <h1>-</h1>
</body>
</html>

IE8 doesn't render the opacity property. It only works if I try to apply on h1 (and not :after)...

IE8 css tab clearly show a css bug (property value concatenated), renders some bugged property but doesn't render some others (like opacity) : enter image description here

Can someone reproduce this bug and help me resolve it ?

Thanks

Jscti
  • 14,096
  • 4
  • 62
  • 87
  • see: http://stackoverflow.com/questions/7510268/is-there-a-way-to-make-ie8-honour-opacity-on-an-before-pseudo-element – BReal14 Oct 02 '14 at 13:11
  • It's been comented here: http://stackoverflow.com/questions/1948176/opacity-css-not-working-in-ie8 - That IE8 needs a layout to the element to apply opacity. So try adding a `display: inline-block` to it. – LcSalazar Oct 02 '14 at 13:13
  • @LcSalazar: tried without success – Jscti Oct 02 '14 at 13:19

0 Answers0