# CSS Question: Any way to prevent em inheritance?



## paulm (Apr 13, 2009)

Hey!

Does anyone have an idea about whether or not it is possible to prevent em size inheritance?

For example, if I make an em within the body of the HTML equal 10px, then set my header div to 1.2em (equal to 12px), and I want to make the header text div equal to 14px, is there any way I can prevent the header text from inheriting the header div font size, but instead only inherit from the body, so that I can use 1.4em as my header text size instead of 1.17em?

HTML:

```
<body>
     <div id="header">
          <div id="header_text">
               <p>My header text...</p>
          </div>
     </div>
</body>
```

Annoying CSS method:

```
body { font-size: 62.5%;} #header { font-size: 1.2em; } #header_text { font-size: 1.17em; }
```

Way I want to do it:

```
body { font-size: 62.5%;} #header { font-size: 1.2em; } #header_text { font-size: 1.4em; }
```

Any tricks I can use, or am I stuck with a calculator when I code accessible font sizing?


----------

