Why CSS inheritance doesn't work for me in IE8?

I have a situation where I am browsing where some CSS properties will not be inherited. It revolves around tables and IE8. Using the HTML sample below, I cannot get the text inside the table to inherit the green color.

This works in Firefox and Chrome, but not IE8 and from reading it seems to have always been a problem in IE, but was meant to work in version 8 from what I read.

I tried to specify the value of inheritance wherever possible, but useless, so the question is, is CSS CSS inheritance support an error or am I missing something?

I don’t have to respond to changing the inline CSS to be classes, and of course I don’t want to comment on the tables, since all this is connected with the creation and creation of HTML emails in which the inline CSS and the tables are important.

<html>
<head></head>
<body>
<table style="color: green;">
  <tr>
    <td>
      <span>Span</span>
      <p>Paragraph</p>
      <div>Div</div>
      <table style="color:inherit;">
        <tr>
          <td>Table</td>
        </tr>
      </table>
    </td>
  </tr>
</table>
</body>
</html>
+5
source share
2 answers

You are right, this is rather strange, although I believe that adding a valid doctype solves the problem. http://jsbin.com/etuti/2

+4
source

I have never had a problem with inheritance in any of IE. Usually I have problems with the lack of a selector and support for properties, as well as with positioning errors, etc.

, ? , ( )

  • Inline style (style="color: green;")
  • (#bob)
  • (.jill)
  • (body)

, !important help? , , .

+1

All Articles