What's the best font size type to use?

I've always used % for my text, mainly to allow the user to change the font size in the browser if required.

However this sometimes shows different sizes in differenet browsers. Which of the others work best and are used more commonly?

px? em? pt?

thanks.

 

I usually use fixed size (12 or 14 for content) by pt.

 

12 pt Here as Well, Fonts usually are used in Pt, Images are rendered in Px.

Szie 2 in Forums with BBCode Support.

 

font: normal 12px/160% Verdana, sans-serif;

that's my standard.

 

yes u can use
u just define 12px font size in body tag after u can use % in font size
i make so many websites with this standard
and u can use one more way
just give the font size in em and after u can use font size in % again
this standard going fix in all browser and all resolution

like this

1em=16px

u just write in body font-size=1em
means 16px font size after u use % and reduce the font size what u want.

 

1em!=16px
this is a myth. It may be true on SOME browsers, but that makes it basically useless since it's not even true on the majority of browsers.

There's pretty much no difference between % and em. .5em is 50% and so on. Using em vs using % shouldn't make a difference between machines, however

there are web developers who set body font size:
body {
font-size: 100%;
}
which you'd think is the default anyway, but seems to stop IE from over-exaggerating enlarged text.

Don't use the font-size: 62.5% bs in the body tag either-- while this was earlier encouraged by css gurus, it also ended up falling on its face with people using the Windows Large Fonts dpi (120), making the text too small-- it's also based on the 1em=16px theory/myth.

Seriously all you kids out there may have no problem reading 12px fonts but that's damn small, and IE users canNOT enlarge that (although IE7 will let them zoom, which might be good enough).

Also, I would avoid pt as well. What's a pt? A 72nd of an inch? It's not a pixel. It will look different in every screen as every computer tries to figure out how many parts of an inch it needs to use for so-many pt. Pt is great for a print css, though. It IS a flexible metric, just try to avoid it for made-for-web-alone pages. You'll still get differences with it.

Lastly, take a good look at the fonts you're using. This is a popular font setting:

font: normal 1em/1.2em Verdana, Arial, Helvetica, sans-serif;

This setting here will look smaller on my machine and larger on some browsers on my Windows work machine. Why? Verdana is "bigger" at the same font size than Arial or Helvetica (and Georgia is a bit bigger than Times New Roman in the serifs). My machine doesn't have Verdana, it runs Linux. The Windows machine uses Verdana on most browsers but apparently not on my Safari-for-Windows. So, people who have Verdana, get the bigger Verdana font, and those without, get the smaller Arial font. I always use caution with verdana and georgia if size matters (like, a menu, something with background images or things with sizes).

Don't get me started on Safari and submit buttons! Ack.

 

Oh ****, this ****ing rubbish again.

Ever heard of 'large fonts/120dpi'? Rounding errors, user default resizing?

Yeah, turn large fonts/120dpi on in Windows and check that in IE or Opera. (Firefox actually does this WRONG, as it ignores the system metric - though you can correct by simply changing the default font size)

Previous thread on the same topic -
http://forums.digitalpoint.com/showthread.php?t=842094

Pay close attention to my reply there:
http://forums.digitalpoint.com/showpost.php?p=7812522&postcount=8
(addendum - with FF3 the Mozilla folks have decided to join us in THIS century on resizing content - so one complaint down, now if they would just obey the system metric)

I swear, whatever ****tard came up with the whole "lets use 67.5% to make it pixel match" or the "1em=16px" MYTH needs to be taken round back of the woodshed with a 30-06 and put down like old yeller. It's like the Carlos Mencia grey font-sizes in Yahoo's YUI - serious whiskey tango foxtrot territory!

 

I'm just learning how to use CSS and I was looking for what "em" stands for, because it's mentioned in W3Schools off-hand. This is what they say:

"If you do not specify a font size, the default size for normal text, like paragraphs, is 16px (16px=1em)." -www.w3schools.com/css/css_font.asp

I don't really know the truth of it, nor how to check if what you say is true, either. However, it's coming from one of the major websites that offer both tutorials and reference materials on nearly all web related coding. If you're right, then you should report the issue to their site so noobs (like me) don't get the wrong idea about the interchangability of values.

 

Standard font size is 12px to 14px for content part, and if you looking for heading section so 20 to 25px would be good for this, and standard font for the web is like Arial, Verdana, Tahoma use this font for the web pages

 

W3Schools is outdated half-assed crap, that unfortunately noobs fall for because it starts with W3 so many people think it's somehow affiliated with the W3C - it isn't. Their site has been chock full of known web rot for decades, and reporting it isn't going to fix said apathy.

1EM is SUPPOSED to be the width of a capital M at the CURRENT font size... and while the default font-size is 16px at 96dpi, not all computers run at 96dpi... there are 72dpi handhelds and 120 to 144 dpi desktops. (windows 'large fonts' == 120, win7 medium = 120, win7 large = 144)

rough calculation:
72/75 dpi = 12px default
96 dpi = 16px default
120 dpi == 20px default
144 dpi == 24px default


It's actually WHY you're supposed to use EM -- so that the fonts automatically size to the however big the user wants it WITHOUT them having to dive for the zoom...

Nice bump for a two year old thread... though it's still a relevant topic since nobody seems to be able to be bothered to do it correctly anymore; **** sake it was better a decade ago than it was today, as at least then we didn't have the pixel perfect photoshop junkies pissing all over websites with their pixel perfect fixed widths and total ignorance of what's actually viable to put on a website if you actually care about what websites are for -- delivering CONTENT to users.

As I always say, people visit websites for the content, NOT the goofy images or crappy scripted animated bullshit that the art **** hang on it... Which is why Google, Amazon and eBay are so successful; Not exactly graphical/scripting "gee ain't it" neat tour de force, are they? (Though admittedly, Google is slowly flushing themselves with all the scripting for nothing asshattery)

 

Depends, if you're building a site that should stretch sizes for mobile phones and tablets for example, you should use em, and % for width/height/margin/padding. Else, I just use px.

 

I used to use 'em' previously but now I use 'px'

 

Define font-size for body in px
define rest of sizes in ems (relative to font-sized defined in px)

 

... wow... and completely defeat THE ENTIRE POINT OF USING %/EM IN THE FIRST PLACE...

So basically three posters in a row pissing on accessibility since I looked in last...

 

My personal choice is 12pt for paragraph text.

 

There was an interesting post on smashing magazine about this a while ago. The conclusion of the poster was to use at least 16px and a line height of 140%, which I can personally really agree on. I really hate it when people are using small fonts, I don't even read it, but just click the exit button straight away.

 

i think font size 12 is the best and widely used

 

12 pt is the commonly used and standard size. this size is only for content not for title

 

Of course, the fact that pt is for print and not the web browser doesn't bother you at all.

 

Yeah! Bad and wrong information helps DP'ers get through their day, everyday!!!