CSS learning

[Hans]

I try to learn CSS from the very beginning and have created a stylesheet
with:

h1 {font-family: Verdana; font-size: 28px; color: #003366;}
body {font-family: Georgia; font-size: 10px; color: #003366;}
body {background-color: #0099cc;}

I use Frontpage 2003, and when I have a look on it by using Frontpage and
when I am in WYSIWYG , I am told the font-size of h1 is 21 and the body is
8. If I set the h1 to 300 inside the CSS, Frontpage will tell me it is 225,
and so on. What it happening?

Thanks

Hans

 

[Ronx]

Look at the units for the sizes:

You specified pixels, FrontPage is showing points. Roughly speaking
with IE (or FrontPage) as the browser, 10px is the same as 8pts, but
this will not be true in other browsers.

 

[Hans]

Thank you! I am used to what a certain size in pts is, as I have worked with
FrontPage, but is any of the systems to prefer?

Hans

 

[Ronx]

Pts are a print metric, good for printed documents but should be avoided
for screen documents - 1pt is 1/72 inches - how big is that on a screen?
Different browsers interpret the pixel to point ratio differently,
resulting in different displays for text.

Pixels display the same size in all browsers - but IE users have
problems resizing text if the text is too small to read - in my opinion
10px text is too small for body text, I use 13px at a minimum.

Other measuremnts scale easily for users - ems, % and keywords.
Keywords require the use of a complete and valid !doctype, or IE users
will see text a size (10% ?) larger than those using other browsers.

http://www.rxs-enterprises.org/tests/ems-percent.aspx shows examples of
text sizing, and how they resize in a browser.
--
Ron Symonds - Microsoft MVP (Expression)
Reply only to group - emails will be deleted unread.

http://www.rxs-enterprises.org/fp

 

[Hans]

Thanks again.

Hans

Pts are a print metric, good for printed documents but should be avoided
for screen documents - 1pt is 1/72 inches - how big is that on a screen?
Different browsers interpret the pixel to point ratio differently,
resulting in different displays for text.

Pixels display the same size in all browsers - but IE users have problems
resizing text if the text is too small to read - in my opinion 10px text
is too small for body text, I use 13px at a minimum.

Other measuremnts scale easily for users - ems, % and keywords. Keywords
require the use of a complete and valid !doctype, or IE users will see
text a size (10% ?) larger than those using other browsers.

http://www.rxs-enterprises.org/tests/ems-percent.aspx shows examples of
text sizing, and how they resize in a browser.
--
Ron Symonds - Microsoft MVP (Expression)
Reply only to group - emails will be deleted unread.

http://www.rxs-enterprises.org/fp