nested lists, em font tags, and inheritance

[myatia]

Hi, all,

I'm having issues with some nested list tags. I've set the font for each <li> element to 0.8em. When I nest the list tags, as shown below, the nested text shows up really small (0.64em, I'm assuming). How do I stop this? Any advice would be appreciated.

Misty

Stylesheet

div.bodyCopy li { font-size:0.8em; line-height:1.5em; }

Nested list

<ul>
<li>Non-competitive environment</li>
<li>Link on Conference website</li>
<li>Email blasts</li>
<li>Recognition in various publications
   <ul>
      <li>Footnote</li>
      <li>Conference Program</li>
      <li>Press Release</li>
   </ul></li>
<li>Prominent signage at event</li>
<li>Attendee list at conclusion of conference</li>
</ul>

Misty Garrick

http://www.mistygarrick.com

 

[Foamcow]

Hmm, I think that an em is a relative value. It's the width of a lowercase "m" character in the typeface chosen at a particular point size.

If you nest something at 0.8em then it will be 0.8 of the parent size (it sees the parent as 1em).

Foamcow Heavy Industries - Web design and ranting
Buy Languedoc wines in the UK

 

[myatia]

Yep, that's the default behavior. Is there a way to override it so that both the top-level and nested list items are both 0.8em? I need to add a statement like the following to my CSS, but don't know what code will do it:

ul li ul li { stop-inheriting-code-here }

"font-size:inherit" works here for Firefox, but not IE.

Any ideas?

Misty



Misty Garrick

http://www.mistygarrick.com

 

[Vragabond]

div.bodyCopy li li { font-size: 1em; }

 

[myatia]

Thanks! I knew it was something simple like that. Thanks for your help.

Misty


Misty Garrick

http://www.mistygarrick.com