Take the 2-minute tour ×

I have a situation that I am looking at where certain CSS properties will not be inherited. This revolves around tables and IE8. Using the sample HTML below I cannot get the text within the table to inherit the green colour.

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

I have tried to specify the inherit value everywhere possible, but to no avail so the question is whether the CSS inheritance support in IE8 is buggy, or am I missing something?

I don't want answer changing inline CSS to be classes and I certainly dont wan't any comments on tables as this all stems from building and designing HTML emails where inline CSS and tables are essential.

<table style="color: green;">
      <table style="color:inherit;">
share|improve this question

2 Answers 2

up vote 3 down vote accepted

You're right, this is pretty odd, although I find that adding a valid doctype solves the problem. http://jsbin.com/etuti/2

share|improve this answer
Interesting. I'm sure I tried this, probably refreshed the wrong page or something. Thanks. –  rrrr Apr 8 '10 at 13:41
A pleasure. Apparantly font formatting is dis-inherited in ie's quirks mode. –  graphicdivine Apr 8 '10 at 13:48

I've never had a problem with inheritance in any of the IEs. I usually have problems with lack of selector and property support, as well as positioning bugs etc.

Could it be you don't have the correct specificity with your selectors? I'm pretty sure they go in this order (from most specific to less)

  • Inline style attribute (style="color: green;")
  • Id selector (#bob)
  • Class selector (.jill)
  • Element selector (body)

If that all fails, could adding !important help? I'd use this as a last resort, as usually you can just give specificity by providing a more specific selector.

share|improve this answer

Your Answer


