CSS Font Size Question

K

K

I am not very good at CSS but I am learning.

A simple question. I want to do my font sizes so they are a specific size
to begin with but then so that they also scale when a user changes the text
size in their browser.

How can I achieve this?

Thank you
 
B

Bernhard Sturm

K said:
I am not very good at CSS but I am learning.

A simple question. I want to do my font sizes so they are a specific size
to begin with but then so that they also scale when a user changes the text
size in their browser.

How can I achieve this?

define in your body element a specific % value for the default font-size
(e.g. body {font-size:85%;})

define all your font-size in your CSS rules with ems
e.g. h1 {font-size:2em;}

This is one approach, another would be to use keywords for your font-sizes.

HTH
bernhard
 
J

Jukka K. Korpela

K said:
I am not very good at CSS but I am learning.

Then don't set any font sizes.
I want to do my font sizes so they are a specific size to begin with

Stop wanting that. Just as you shouldn't want to set a specific volume
(for aural rendering) or the size of dots used in Braille rendering.
but then so that they also scale when a user changes
the text size in their browser.

The user can change the font size, though people often don't know how to.
As an author you can make it more difficult to most people by trying
to enforce your idea of font size.
 
K

K

Bernhard Sturm said:
define in your body element a specific % value for the default font-size
(e.g. body {font-size:85%;})

define all your font-size in your CSS rules with ems
e.g. h1 {font-size:2em;}

This is one approach, another would be to use keywords for your
font-sizes.

HTH
bernhard

In IE the menu option to change text size is Smallest, Smaller, Medium,
Larger, Largest.

Do you know what percentages would match each of these?

Thanks
 
S

Steve Pugh

K said:
In IE the menu option to change text size is Smallest, Smaller, Medium,
Larger, Largest.

Do you know what percentages would match each of these?

They're all 100%. Those are the user's options for their default font
size, hence 100% will equal whatever the currently selected option is.

Steve
 
J

Jukka K. Korpela

Bernhard Sturm said:
define in your body element a specific % value for the default font-size
(e.g. body {font-size:85%;})

That would mean saying that you know that all users have chosen to use a
browser's font size setting that is exactly 15 % smaller than they should
be using.
 
R

rf

Jukka K. Korpela said:
That would mean saying that you know that all users have chosen to use a
browser's font size setting that is exactly 15 % smaller than they should
be using.

Er, you mean 17.6% larger then they should be using, and applying the 85%
puts it back to 100%, what they should be using.

IMHO the 85% really means that Bernhard has *his* browser settings 17.6%
larger then *he* should be using. If *he* set *his* browser up correctly
then text would look exactly fine to *him* at 100% :)
 
B

Bernhard Sturm

rf said:
IMHO the 85% really means that Bernhard has *his* browser settings 17.6%
larger then *he* should be using. If *he* set *his* browser up correctly
then text would look exactly fine to *him* at 100% :)

which in turn would mean, that all others have set their browser font
size settings 17.6% lower than they should be :)

BTW: do you know where to set the default font-size in IE6.x?
;-) so you see... not everybody (read at least 80%) is able to define
their font-sizes in the UA ;-)
 
B

Bernhard Sturm

Jukka said:
The user can change the font size, though people often don't know how to.

where do you define the default font-size in IE?
I know where to define it for mozilla and opera, but couldn't figure out
where to define it in IE. As at least 80% of the users are still using
IE, this is something you should take into account as an author as well.
 
B

Barbara de Zoete

where do you define the default font-size in IE?

In IE6 one can set font-size. (I have to translate the menu's from Dutch, so the
actual frases in the menu's might be different)

[Menu: Extra] > [Item: Internet Options] > [Tab: General] > [Button: Colors] OR
[Button: Lettertype]
With these two you can set specific font-family and size and specific colors.

Then, with:
[Menu: Extra] > [Item: Internet Options] > [Tab: General] > [Button:
Accessibility]
In the dialog that pops up, you can turn off the use of font-sizes,
font-families and colors as set by webauthor. You can even set your own
stylesheet in that dialog.


--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'
 
S

Steve Pugh

Bernhard Sturm said:
where do you define the default font-size in IE?

There are two ways to define the default font size in Windows IE (Mac
IE differs slightly). First, you can pick one of the five preset sizes
(smallest, smaller, medium, larger, largest). Secondly, you can create
a user stylesheet and specify a default size in there. The first
method is very simple but doesn't give you fine control.
I know where to define it for mozilla and opera, but couldn't figure out
where to define it in IE. As at least 80% of the users are still using
IE, this is something you should take into account as an author as well.

Yep, I know some IE users who have their browser set to use 'smaller'
as their default and some who have 'larger' set as their default. So
the fact that users have defaults other than 16px ('medium' assuming
Windows is set to use small fonts) is something that we have to take
into account.

Steve
 
B

Bernhard Sturm

Barbara said:
where do you define the default font-size in IE?


In IE6 one can set font-size. (I have to translate the menu's from
Dutch, so the actual frases in the menu's might be different)

[Menu: Extra] > [Item: Internet Options] > [Tab: General] > [Button:
Colors] OR [Button: Lettertype]

hmm maybe I have a different version, but I can only set the font and
its color, but definitely not its size.
I use IE 6.0.2900 Win XP SP2
So maybe someone else knows where to define the default font size?
 
B

Bernhard Sturm

Barbara said:
where do you define the default font-size in IE?


In IE6 one can set font-size. (I have to translate the menu's from
Dutch, so the actual frases in the menu's might be different)

[Menu: Extra] > [Item: Internet Options] > [Tab: General] > [Button:
Colors] OR [Button: Lettertype]

hmm maybe I have a different version, but I can only set the font and
its color, but definitely not its size.
I use IE 6.0.2900 Win XP SP2
So maybe someone else knows where to define the default font size?
so maybe only Steve's method by defining a stylesheet will help here?
but I really doubt that a lot of IE users are going to creat a
stylesheet in order to change their default font-size ;-)
 
B

Barbara de Zoete

Barbara said:
Jukka K. Korpela wrote:


The user can change the font size, though people often don't know how to.


where do you define the default font-size in IE?
In IE6 one can set font-size. (I have to translate the menu's from Dutch,
so the actual frases in the menu's might be different)
[Menu: Extra] > [Item: Internet Options] > [Tab: General] > [Button: Colors]
OR [Button: Lettertype]

hmm maybe I have a different version, but I can only set the font and its
color, but definitely not its size.
I use IE 6.0.2900 Win XP SP2

ditto
I was too quick with my 'size' in the sentence that followed that menu
explaining thing. Size can be overruled by checking the box in front of 'ignore
font size in webpage' (or something like that), so a page will render with IE's
default and you can easily use the choices smaller, bigger, what ever you need.
Setting a user stylesheet seems to be the only way to set font-size yourself.




--
,-- --<--@ -- PretLetters: 'woest wyf', met vele interesses: ----------.
| weblog | http://home.wanadoo.nl/b.de.zoete/_private/weblog.html |
| webontwerp | http://home.wanadoo.nl/b.de.zoete/html/webontwerp.html |
|zweefvliegen | http://home.wanadoo.nl/b.de.zoete/html/vliegen.html |
`-------------------------------------------------- --<--@ ------------'
 
J

Jukka K. Korpela

Steve Pugh said:
There are two ways to define the default font size in Windows IE (Mac
IE differs slightly). First, you can pick one of the five preset sizes
(smallest, smaller, medium, larger, largest). Secondly, you can create
a user stylesheet and specify a default size in there. The first
method is very simple but doesn't give you fine control.

The first method isn't as simple as it should and as it was. There used to
be a font size button in the IE's bar of buttons, but in some version it
was removed, so you need to use the View/Font size (or is it Text size?)
menu. The problem is that a font size control button _suggests itself_ to
the user, whereas the command, though simple per se, needs to be _found_ by
the user. - You can still configure IE to have the font size button in the
bar, and should indeed do so e.g. for a IE on a public PC.

The user style sheet method is simpler than it sounds, but the user still
needs to know about, to use the clumsy way of getting to the settings that
make IE use a user style sheet (though it doesn't take that much _time_ to
get there if you use the keyboard) and to find or write a suitable user
style sheet. In the simplest case, the style sheet could be just

body { font-size: 11pt; }

But if you need a substantially larger font size, for example, then you
encounter the problem that e.g. the defaults for heading sizes on IE are
fixed sizes, not relative to the parent element's font size (as they should
be). Thus, you would need to set font size for headings as well, and for
other elements that have their own default sizes on IE.
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,755
Messages
2,569,535
Members
45,007
Latest member
obedient dusk

Latest Threads

Top