Mon, 2011-09-26 13:38
Hi,
i have attached below classes to <body> and <h3> element in my html -
body {
font: 11px arial,helvetica;
}
h3 {
font-family: 'Lucida Sans';
}
When I open my html in IE 8, the text inside <h3> tag has Arial font with size 11 px. But when I open my html in Firefox, the text inside <h3> tag has Lucida Sans with size 11 px.
can anyone help with this? i dnt understand whether font property overrides font family? or why is this coming up differntly in differnt browsers?
pls suggest. thnx in advnce.
Tue, 2011-09-27 06:04
#1
It's not necessarily that
It's not necessarily that font is overridden by 'font-family' but that you are specifying one of the property declarations belonging to 'font' after the initial declaration so yes you should be seeing 'Lucida Sans' on your heading tag. Why IE is not behaving could be for a number of reasons but you haven't shown us what you are working with by way of code so it's difficult to be specific.
Tue, 2011-09-27 15:24
#2
hi, thanks for looking at
hi,
thanks for looking at this. I have pasted a test html page. If you look at this page in IE and Firefox, you will see the differnce.
Test Page
body {
font: 11px arial;
}
h3 {
font-family: 'Lucida Sans';
}
This is Test Page to check rendering.
Tue, 2011-09-27 19:15
#3
That is NOT! a test page
That is NOT! a test page 
try creating a proper test page and then see gow things perform.
Wed, 2011-09-28 16:25
#4
sorry, i m new to thi sforum,
sorry, i m new to thi sforum, i do not know that html code is not rendereed exactly same. whatever html code i paste here, is rendered by this browser, may be not all html tags/code is supported in this forum. I replaced all "<" with "[" and ">" with "]".can i request to replace "[" with "<" and "]" with ">", that should be a valid html
Edited by Tony, just type the markup and wrap it in code tags
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Test Page</title> <style type="text/css"> body { font: 11px arial; } h3 { font-family: 'Lucida Sans'; } </style> </head> <body> <br /> <h3><a name="This_is_Test_Page_to_check_rendering">This is Test Page to check rendering.</a></h3> </p><p> </body> </html>
Fri, 2011-09-30 13:04
#5
.
When I open my html in IE 8, the text inside tag has Arial font with size 11 px. But when I open my html in Firefox, the text inside tag has Lucida Sans with size 11 px.
I got caught out on this recently so I'd advise checking your browser defaults/preferences
Also please not that 11px is NOT the equivalent of what you see as 11pt in a word processing program!
11px is the equivalent of 7.5pt. Try that in your word program and see if it's comfortable to read a whole page of text with your monitor an arm's length away.
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again 