Converting font size from pix to em or %

Hiya,

Thanks for all the useful info I have discovered here .... you folks rock !!

I'm "almost" finished my first and basic foray into CSS ... still got a
looong way to go in the learning curve ... but ... I keep seeing
comments and opinions on not using pixel size for fonts, but to use % or
em to allow font resizing ...

My main question is there a formula or ready reference type list around
to let me figure out how to convert pix size to em or %

TIA
K

Hey K:
Take a look at these - which may help:
http://css-discuss.incutio.com/?page=FontSize
http://www.bigbaer.com/css_tutorials/css_font_size.htm
http://www.htmlhelp.com/reference/css/font/font-size.html

--
Nadia
Team Macromedia Volunteer for Dreamweaver
--------------------------------------------
Free Templates | Free Nav Bar Sets
http://www.DreamweaverResources.com
Dropdown/Flyout Menu Designs | CSS Layouts
Ecommerce - YVStore | SEO Articles |Tutorials
---------------------------------------------
MM Dreamweaver Tutorials
http://macromedia.com/devnet/mx/dreamweaver/
---------------------------------------------
Email: nperre at gmail dot com
---------------------------------------------

"karebai" <karebaiREMOVE (AT) THIS489designs (DOT) net> wrote

Hiya,

Thanks for all the useful info I have discovered here .... you folks rock
!!

I'm "almost" finished my first and basic foray into CSS ... still got a
looong way to go in the learning curve ... but ... I keep seeing comments
and opinions on not using pixel size for fonts, but to use % or em to
allow font resizing ...

My main question is there a formula or ready reference type list around to
let me figure out how to convert pix size to em or %

TIA
K

kewl ... thanks Nadia

Nadia *TMM* wrote:

Hey K:
Take a look at these - which may help:
http://css-discuss.incutio.com/?page=FontSize
http://www.bigbaer.com/css_tutorials/css_font_size.htm
http://www.htmlhelp.com/reference/css/font/font-size.html

You're welcome !

--
Nadia
Team Macromedia Volunteer for Dreamweaver
--------------------------------------------
Free Templates | Free Nav Bar Sets
http://www.DreamweaverResources.com
Dropdown/Flyout Menu Designs | CSS Layouts
Ecommerce - YVStore | SEO Articles |Tutorials
---------------------------------------------
MM Dreamweaver Tutorials
http://macromedia.com/devnet/mx/dreamweaver/
---------------------------------------------
Email: nperre at gmail dot com
---------------------------------------------
"karebai" <karebaiREMOVE (AT) THIS489designs (DOT) net> wrote

kewl ... thanks Nadia

Nadia *TMM* wrote:

Hey K:
Take a look at these - which may help:
http://css-discuss.incutio.com/?page=FontSize
http://www.bigbaer.com/css_tutorials/css_font_size.htm
http://www.htmlhelp.com/reference/css/font/font-size.html

Handy sites for explanations .... found this one on a more intense
search .... this what I was basically looking for may come in handy for
future newbies you may come across ...
http://4ums.com/tools/font-size_em_reference.html

and thanks again )

K

Nadia *TMM* wrote:

You're welcome !

Hi

Just a word of warning on using ems, it you are going to use that unit
don't use it as your default unit on the body or you will trigger some
text sizing bugs in earlier versions of IE (5x) where the font size
scales oddly and becomes very tiny. IMHO I would use %, set the default
size on the body to 100.01% and then scale off that.

for instance:

p {
font-size: 80%;
}

h1 {
font-size: 135%;
}

etc


--
Cheers jojo
Team Macromedia Member Volunteer for Dreamweaver MX
http://www.webade.co.uk
----------------------------------------------------
Extending Knowledge, Daily.
http://www.communityMX.com/
Free 10 day trial
http://www.communitymx.com/joincmx.cfm
----------------------------------------------------

why 100.01% and not just 100%?
"jojo" <jojo (AT) zoot3 (DOT) com> wrote

Hi

Just a word of warning on using ems, it you are going to use that unit
don't use it as your default unit on the body or you will trigger some
text sizing bugs in earlier versions of IE (5x) where the font size scales
oddly and becomes very tiny. IMHO I would use %, set the default size on
the body to 100.01% and then scale off that.

for instance:

p {
font-size: 80%;
}

h1 {
font-size: 135%;
}

etc


--
Cheers jojo
Team Macromedia Member Volunteer for Dreamweaver MX
http://www.webade.co.uk
----------------------------------------------------
Extending Knowledge, Daily.
http://www.communityMX.com/
Free 10 day trial
http://www.communitymx.com/joincmx.cfm
----------------------------------------------------

Negates a bug in older versions of Opera when scaling off the body,
Safari - I believe - has problems scaling from 101%, so 100.01% seems a
good solution.

--
Cheers jojo
Team Macromedia Member Volunteer for Dreamweaver MX
http://www.webade.co.uk
----------------------------------------------------
Extending Knowledge, Daily.
http://www.communityMX.com/
Free 10 day trial
http://www.communitymx.com/joincmx.cfm
----------------------------------------------------

jojo wrote:

so 100.01% seems a good solution.

As in works reliably cross browser and cross platform.

--
Cheers jojo
Team Macromedia Member Volunteer for Dreamweaver MX
http://www.webade.co.uk
----------------------------------------------------
Extending Knowledge, Daily.
http://www.communityMX.com/
Free 10 day trial
http://www.communitymx.com/joincmx.cfm
----------------------------------------------------

noted, tks

"jojo" <jojo (AT) zoot3 (DOT) com> wrote

jojo wrote:

so 100.01% seems a good solution.

As in works reliably cross browser and cross platform.

--
Cheers jojo
Team Macromedia Member Volunteer for Dreamweaver MX
http://www.webade.co.uk
----------------------------------------------------
Extending Knowledge, Daily.
http://www.communityMX.com/
Free 10 day trial
http://www.communitymx.com/joincmx.cfm
----------------------------------------------------