473,701 Members | 2,594 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Best way to specify font size

JD
Hi guys

What's the best way to specify font size using CSS? I try to avoid
absolute units like pt and px because then users can't resize the fonts
in IE, but % and em are a complete pain to use IMO. I read somewhere (a
W3C tip I think) that the best way is to specify a "base" size and then
have all your fonts relative that, but I'm not sure how that works.

TIA
Dec 11 '05 #1
16 3890
Els
JD wrote:
Hi guys

What's the best way to specify font size using CSS? I try to avoid
absolute units like pt and px because then users can't resize the fonts
in IE, but % and em are a complete pain to use IMO. I read somewhere (a
W3C tip I think) that the best way is to specify a "base" size and then
have all your fonts relative that, but I'm not sure how that works.


What's the pain in using %?
Just set 100% for <body> (the "base" size), and then use other
percentages like 85% for small print and 120% for headings, etc.
Those are indeed relative to the percentage set for the <body>.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Dec 11 '05 #2
JD wrote:
What's the best way to specify font size using CSS? I try to avoid
absolute units like pt and px because then users can't resize the
fonts in IE, but % and em are a complete pain to use IMO. I read
somewhere (a W3C tip I think) that the best way is to specify a
"base" size and then have all your fonts relative that, but I'm not
sure how that works.


body { font-size: 100%; }
h1 {font-size: 160%; } /* set hx as appropriate */
h2 {font-size: 140%; }
h3 {font-size: 125%; }
..legalese {font-size: 85%; }

Not much of a pain. <g> If your site fails with these kinds of
settings, something else is wrong.

Oh, in future for CSS questions, use
comp.infosystem s.www.authoring.stylesheets

--
-bts
-Warning: I brake for lawn deer
Dec 11 '05 #3
On Sun, 11 Dec 2005 18:45:28 +0000, JD <us**@example.n et> wrote:
What's the best way to specify font size using CSS?


I use %, personally. The problem is that users' needs vary so much,
trying to control the size of the text is a pointless endeavor. In the
end, the user is most accustomed to the default font size (100%), and
if they need to change it, they can, through the browser.

If I may, I think one of the pitfalls in web design is trying to get
everything perfect. Graceful degradation is the best we can shoot for.

Ian
--
http://www.bookstacks.org/
Dec 11 '05 #4
__/ [Els] on Sunday 11 December 2005 18:54 \__
JD wrote:
Hi guys

What's the best way to specify font size using CSS? I try to avoid
absolute units like pt and px because then users can't resize the fonts
in IE, but % and em are a complete pain to use IMO. I read somewhere (a
W3C tip I think) that the best way is to specify a "base" size and then
have all your fonts relative that, but I'm not sure how that works.


What's the pain in using %?
Just set 100% for <body> (the "base" size), and then use other
percentages like 85% for small print and 120% for headings, etc.
Those are indeed relative to the percentage set for the <body>.


Overall, this probably depends on the page in question. There are cases where
the font size should be relative to the screen/window size. In such
circumstances, 'em' should be used. It takes an example to give a proper
answer, in my humble opinion.

Roy

--
Roy S. Schestowitz | "Software sucks. Open Source sucks less."
http://Schestowitz.com | SuSE Linux | PGP-Key: 0x74572E8E
7:00am up 1 day 14:08, 18 users, load average: 0.50, 0.63, 0.57
Dec 12 '05 #5
Els
Roy Schestowitz wrote:
__/ [Els] on Sunday 11 December 2005 18:54 \__
JD wrote:
Hi guys

What's the best way to specify font size using CSS? I try to avoid
absolute units like pt and px because then users can't resize the fonts
in IE, but % and em are a complete pain to use IMO. I read somewhere (a
W3C tip I think) that the best way is to specify a "base" size and then
have all your fonts relative that, but I'm not sure how that works.


What's the pain in using %?
Just set 100% for <body> (the "base" size), and then use other
percentages like 85% for small print and 120% for headings, etc.
Those are indeed relative to the percentage set for the <body>.


Overall, this probably depends on the page in question. There are cases where
the font size should be relative to the screen/window size. In such
circumstances, 'em' should be used. It takes an example to give a proper
answer, in my humble opinion.


It also takes an example to explain how 'em' is relative to
screen/window size and % isn't.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: La Bouche - Be My Lover
Dec 12 '05 #6
__/ [Els] on Monday 12 December 2005 07:27 \__
Roy Schestowitz wrote:
__/ [Els] on Sunday 11 December 2005 18:54 \__
JD wrote:

Hi guys

What's the best way to specify font size using CSS? I try to avoid
absolute units like pt and px because then users can't resize the fonts
in IE, but % and em are a complete pain to use IMO. I read somewhere (a
W3C tip I think) that the best way is to specify a "base" size and then
have all your fonts relative that, but I'm not sure how that works.

What's the pain in using %?
Just set 100% for <body> (the "base" size), and then use other
percentages like 85% for small print and 120% for headings, etc.
Those are indeed relative to the percentage set for the <body>.


Overall, this probably depends on the page in question. There are cases
where the font size should be relative to the screen/window size. In such
circumstances, 'em' should be used. It takes an example to give a proper
answer, in my humble opinion.


It also takes an example to explain how 'em' is relative to
screen/window size and % isn't.


I believe that this argument will be meaningless to development which is
Internet Explorer-centric:

http://archivist.incutio.com/viewlist/css-discuss/1439

As far as I can gather, em gives a great deal of power. I have just tried
some pages of mine under Opera (which I know you advocate) to reveal some
unpleasant interpretations of the source. Overall, Opera at its present
seems excellent so I am glad I took your word.

Roy
Dec 12 '05 #7
Els
Roy Schestowitz wrote:
__/ [Els] on Monday 12 December 2005 07:27 \__
Roy Schestowitz wrote:
__/ [Els] on Sunday 11 December 2005 18:54 \__
JD wrote:

> What's the best way to specify font size using CSS? I try to avoid
> absolute units like pt and px because then users can't resize the fonts
> in IE, but % and em are a complete pain to use IMO. I read somewhere (a
> W3C tip I think) that the best way is to specify a "base" size and then
> have all your fonts relative that, but I'm not sure how that works.

What's the pain in using %?
Just set 100% for <body> (the "base" size), and then use other
percentages like 85% for small print and 120% for headings, etc.
Those are indeed relative to the percentage set for the <body>.

Overall, this probably depends on the page in question. There are cases
where the font size should be relative to the screen/window size. In such
circumstances, 'em' should be used. It takes an example to give a proper
answer, in my humble opinion.
It also takes an example to explain how 'em' is relative to
screen/window size and % isn't.


I believe that this argument will be meaningless to development which is
Internet Explorer-centric:

http://archivist.incutio.com/viewlist/css-discuss/1439


That's about sizes for elements other than font.
Yes, if I want a box to scale with the text inside, I use em, as it's
relative to the font-size, while percentage is relative to the
viewport or parent element. (I never saw a difference between IE and
the other browsers in that btw - maybe something in Quirksmode?)

I still don't see how em is relative to screensize really.
A font-size of 1em is equal to a font-size of 100% afaik.
IE has a scaling problem if the font-size for <body> isn't set in
percentages, but other than that, I see no difference.
As far as I can gather, em gives a great deal of power. I have just tried
some pages of mine under Opera (which I know you advocate) to reveal some
unpleasant interpretations of the source. Overall, Opera at its present
seems excellent so I am glad I took your word.


I advocate Opera?
Hmm.. might have done by accident some time... ;-)
I use Opera and Firefox, and I still prefer Firefox, although I'm
starting to use Opera more and more for surfing. Not because I think
it's a better browser, but because I like to keep more than one
browser open, so it's easier to differentiate between work-tabs and
surf-tabs.

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: The Cult - She Sells Sanctuary (Long Version)
Dec 12 '05 #8
Ian Rastall <id*******@gmai l.com> writes:
On Sun, 11 Dec 2005 18:45:28 +0000, JD <us**@example.n et> wrote:
What's the best way to specify font size using CSS?


I use %, personally. The problem is that users' needs vary so much,
trying to control the size of the text is a pointless endeavor. In the
end, the user is most accustomed to the default font size (100%), and
if they need to change it, they can, through the browser.


....actually, anecdotal evidence suggests that the user is generally
unaccustomed to the default font size, finding it larger than the
majority of pages they view.

However, that's not a reason to avoid using the default size -
most users seem to prefer it to the 'common' smaller sizes, and those
that don't can resize it.

--
Chris
Dec 12 '05 #9
Els wrote:

What's the pain in using %?
Just set 100% for <body> (the "base" size), and then use other
percentages like 85% for small print and 120% for headings, etc.
Those are indeed relative to the percentage set for the <body>.

It is a percentage of whatever the size is for the containing element,
yes? If I set the font-size to 85% for a <div>, then 85% again for a <p>
in that div, the final size is 72% of the original font-size spec.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)
Dec 12 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

131
21659
by: Peter Foti | last post by:
Simple question... which is better to use for defining font sizes and why? px and em seem to be the leading candidates. I know what the general answer is going to be, but I'm hoping to ultimately get some good real world examples. Fire away! :) Regards, Peter Foti
145
8820
by: Mark Johnson | last post by:
Oddly enough, I found it difficult, using Google, to find a list of best-of sites based on the quality of their css packages. So I'd ask. Does anyone know of particularly good sites which are in good measure because of their creative and useful css designs? I'm aware of Zen Garden and a few others. So don't bother with those. And I hope I don't get replies from people with a 'tin ear' and no design sense. Good sites. Good pages. That's...
2
2935
by: Mike Button | last post by:
Hello all, I am really really desperate on what I should do, and I am asking for help from anyone in this newsgroup, here's the situation: I am creating a form that is being run on a server where there is no scripts allowed running (the software is from Opentext called Livelink)- therefore I need javascript to do the tasks listed below: 1. validate the form - this has been completed 2. pop up another window that will go ahead and...
10
1714
by: Yeah | last post by:
Is there a way to tell CSS to specify one font for a table that has many cells in which the font is being used? As in, one font that represents the table itself (rather than specifying in every cell) Thanks! :-)
1
8636
by: FLEMEF | last post by:
Hello All, I'm not very good at Java... With this piece of Java code, how could I modify the StyleOptions.java program to allow the user to specify the size of the font, while using the text field to obtain the users input. Thanks. ----------------------------------------------------------------- import javax.swing.*; import java.awt.*; import java.awt.event.*;
1
2823
by: Muchach | last post by:
Hello, Ok so what I've got going on is a form that is populated by pulling info from database then using php do{} to create elements in form. I have a text box in each table row for the user to enter input. I need to take this user input and put it back into the database. What would be the best method to do this. I can't use a normal post because the name of the text box is the same for each table row. I've heard that posting the...
2
7649
by: hotflash | last post by:
Hi All, I found the best pure ASP code to upload a file to either server and/or MS Access Database. It works fine for me however, there is one thing that I don't like and have tried to fix but don't have any luck is to do a form validation. This script requires the files: db-file-to-disk.asp and _upload.asp. There is a DESCRIPTION field in the db-file-to-disk.asp file, what I want to do is the user has to field out this fied before...
0
8736
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, well explore What is ONU, What Is Router, ONU & Routers main usage, and What is the difference between ONU and Router. Lets take a closer look ! Part I. Meaning of...
0
8649
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
9083
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
1
8977
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
8934
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
7824
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development projectplanning, coding, testing, and deploymentwithout human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
0
5904
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4410
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
2
2398
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.