font-size: 1.1em

[joonstar]

<style type="text/css">


body {
background-color: teal;
margin: 20px;
padding: 0;
font-size: 1.1em;
font-family: verdana, arial, helvetica, sans-serif;
}
</style>


What does "font-size: 1.1em" mean in the above?

[bradyj]

Length Units

A length value is formed by an optional + or -, followed by a number, followed by a two-letter abbreviation that indicates the unit. There are no spaces in a length value; e.g., 1.3 em is not a valid length value, but 1.3em is valid. A length of 0 does not require the two-letter unit identifier.

Both relative and absolute length units are supported in CSS1. Relative units give a length relative to another length property, and are preferred since they will better adjust to different media. The following relative units are available:

em (ems, the height of the element's font)
ex (x-height, the height of the letter "x")
px (pixels, relative to the canvas resolution)


Absolute length units are highly dependent on the output medium, and so are less useful than relative units. The following absolute units are available:

in (inches; 1in=2.54cm)
cm (centimeters; 1cm=10mm)
mm (millimeters)
pt (points; 1pt=1/72in)
pc (picas; 1pc=12pt)

Taken from:
http://www.htmlhelp.com/reference/css/units.html

But this would better explain it in normal terms:
http://www.bigbaer.com/css_tutorials/css_font_size.htm

And helped me understand better. 1em is the default size of a font in someone's browser window. So if you have 1.1em, think of it as 10% larger than the normal browser font. .8em, is 20% smaller than the normal browser font, make sense? It seemed really wacky for me right off the bat, still is sometimes
:)

[Antoniohawk]

Correct me if I'm wrong fellas, but em is another unit of measure. Em is sort of like percentages in that it makes the font size, in this case, relative to what the user has set the default font size to. In this way, it allows for more cross-browser, cross-platform, cross-resolution support.

Argh brady! Lol, I'll getcha the next time. :)

P.S.
The em unit can be used for more than just fonts. I'm pretty sure that any element that takes a measure will support it.

[]|V|[agnus]

Word. em-based layouts are spiffy. all elements stay proportional to each other when widths, padding and margins are set in em's.

[bradyj]

|V|[agnus']Word. em-based layouts are spiffy. all elements stay proportional to each other when widths, padding and margins are set in em's.

Hmm, I never thought of doing it for all elements... that's interesting, I'll give it a try.

[ronaldb66]

On a personal site-thingy I'm horseing around with at home (when I have the time), I used ems all over the place for margins, padding and the likes. That way, those seperation aspects are proportional to the font size chosen. Pretty cool, really. No pixel-perfectness, though, no by a long shot.

[]|V|[agnus]

hhaaha.. . that's exactly what i said. and yeknow, of course it's not pixel perfect when it's not even based on the pixel... :thumbsup:

[ronaldb66]

Let's call it em-perfect, then?

[]|V|[agnus]

ahahahsf aljdskhgak..

beautiful. :thumbsup:

[Sk8er9547]

em n.

Printing.
The width of a square or nearly square piece of type, used as a unit of measure for matter set in that size of type.
Such a measure for 12-point type; a pica.

pi·ca n.

A printer's unit of type size, equal to 12 points or about 1/6 of an inch.
An equivalent unit of composition measurement used in determining the dimensions of lines, illustrations, or printed pages.
A type size for typewriters, providing ten characters to the inch.

Well there you have it!