homepage Welcome to WebmasterWorld Guest from 54.205.205.47
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Accredited PayPal World Seller

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: DrDoc

CSS Forum

    
Navwrapper interfering with page font sizes
font-size inheritance
cheaperholidays




msg:4284259
 6:02 pm on Mar 19, 2011 (gmt 0)

Hi all

We have this in our page nav css

#navwrapper {margin:0px auto; padding:0; font-size:9pt; width: 860px}

However i am trying to change out page font size to em's and the navwrapper is interfering.

Is there a way we can clear this, i have tried changing it to 0.75em but it still seems to interfere.

I want the page to display as 1.0em but i have to set it at 1.1em or the font goes small?

<body><div id="whole">
<div id="navwrapper" align="left">

<div id="cheaperseo">
<div id="cheaperhols">

Thanks for reading

Mike

 

SuzyUK




msg:4284337
 10:15 pm on Mar 19, 2011 (gmt 0)

em's are inherited (they are virtually equivalent to using %), so they can get a bit complex. Why don't you change to px instead? They're also a relative unit and they will scale with the zoom function or screen resolution

pt's are for print so it's a good thing to change

if you are really keen to go for em's then the body should be set at 1em (or 100%) then no other size should be set on divs or parent elements.. just the element you need to change directly

e.g.
h1 {font-size: 1.6em;} or small {font-size: 0.75em;}

as soon as you set it on a div or try to set it on every element, nesting of elements will affect it..

e.g. if you have your font-size set at 0.9em on the following
div, p, a {font-size: 0.9em;}

then have:
<div>some plain text <p> some paragraph text <a href="#">with a link</a></p></div>

the div ("some plain text") will be 0.9em (90%), the <p> will be 90% of the parent div's 0.9em - approximately 0.81em (81%), and the <a> will be 90% of the <p>'s 0.81em and will be approximately 0.72em (72%)

like I said best not to go there, px are good enough for font-sizes these days :) - it used to be that IE would not scale text that wasn't set in em though there was a workaround for that too, but I think that's only IE6

PS: also remember that em's and percentages will work with users default browser settings so what you see may not be what they're seeing ;) That is also true of pixels as users can set their own minimums but there's less of an overall impact with px..

hth
Suzy

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved