relative font-size of or and their descendants in IE

Question

Trying the \"Eric Meyer Reset\" I stumbled across an issue concerning the font-size:100% declaration to reset the font size of all suitable elements. font

Answer 1

I didn't test it but it works so far:

sup,
sub {
    font-size: inherit;   /* all browser */
    font-size: 120%\0/;   /* wie only */
}

Answer 2

It seems like the only "solution" to leave the font-size:100% reset-declaration in the stylesheet and still have acceptable sub-/superscripts is so far either to:

• Use a different element for styling the sub-/superscripts, e.g. <span>. Definitely not a good idea in the light of semantics → eliminated.
• Use an UserAgent-specific stylesheet, conditional comments at best (which is what I was worried about, because i didn't have to use them for IE ≥ 7, until now) and explictly restyle each descendant to compensate the "coefficient effect" → it's not worth it :-).
• Leave it as it is so everybody can see IE has its own rules (ideally/naively this could force them to fix it in the next version) and use font-size:inherit to have at least the descendants of <sub> or <sup> be the same size by default in IE ≥ 8 → accepted.

---

solution #2, this will do the trick (sure it can be tuned up, but just the concept):

<!--[if IE]>
<style>
  sup *,sub * {font-size:120%; font-size:inherit;}
</style>
<![endif]-->

provided you don't strive for maximum performance (See the * selector performance issue).