css and font-size

S

steve

Hi

I think I miss one of the css lessons:)

I have table in a table, they both have the same style
{font-family:arial; font-size:75%;}
why does it the table in site of the other table apply the css 2 times
and the text size is not 75% but is something like 50%
why is that?
do I miss one lesson in css?

here is a sample http://www.watchestelltime.co.za/testcss.htm

or here you can se the code

<html>
<head>
<style>
..razmer {font-family:arial; font-size:75%;}
</style>
</head>
<body>
<table width="50%" border="1" class="razmer">
<tr>
<td>this is text in table 1<br>
<br>
<table width="50%" border="1" class="razmer">
<tr>
<td>this is text in tale 2</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
 
B

brucie

I have table in a table, they both have the same style
{font-family:arial; font-size:75%;}
Click to expand...

thats is 25% smaller than your visitors preferred size - unreadable
why does it the table in site of the other table apply the css 2 times
and the text size is not 75% but is something like 50%
why is that?
Click to expand...

font is initially 75% defined again at 75% is 75% of 75%
 
E

Eric Bohlman

I have table in a table, they both have the same style
{font-family:arial; font-size:75%;}
why does it the table in site of the other table apply the css 2 times
and the text size is not 75% but is something like 50%
why is that?
do I miss one lesson in css?
Click to expand...

Yep, the lesson where they should have taught you that relative values for
font sizes are always relative to the *computed* size used by the enclosing
element. "font-size: 75%" means "make the font size three-quarters of what
it would have been if I hadn't specified a font size for this element." So
in your outer table, the font size is 75% of what it would be outside the
table (in your example, that means 75% of the browser's default size), and
in your inner table, it's 75% of what it is in the outer table (i.e. what
it would be if you hadn't specified a style for the inner table), which
works out to 56.25% of the default size.

One of the more confusing aspects of CSS is that for some properties (like
font size), percentage values are relative to computed values, while for
other properties they're relative to set values. Keep a copy of the spec
handy!
 
S

Sid Ismail

: Hi
:
: I think I miss one of the css lessons:)
:
: I have table in a table, they both have the same style
: {font-family:arial; font-size:75%;}
: why does it the table in site of the other table apply the css 2 times
: and the text size is not 75% but is something like 50%
: why is that?

75% of 75% = 56.25%
75% of the font size (already 75%)...

: do I miss one lesson in css?

You may have missed two actually...

Sid
 
S

steve

I have table in a table, they both have the same style
Yep, the lesson where they should have taught you that relative values for
font sizes are always relative to the *computed* size used by the enclosing
element. "font-size: 75%" means "make the font size three-quarters of what
it would have been if I hadn't specified a font size for this element." So
in your outer table, the font size is 75% of what it would be outside the
table (in your example, that means 75% of the browser's default size), and
in your inner table, it's 75% of what it is in the outer table (i.e. what
it would be if you hadn't specified a style for the inner table), which
works out to 56.25% of the default size.

One of the more confusing aspects of CSS is that for some properties (like
font size), percentage values are relative to computed values, while for
other properties they're relative to set values. Keep a copy of the spec
handy!
Click to expand...

Were can I find a list or sample or some kind of tutorial of which
properties are relative to what and which one are not
 
B

Beauregard T. Shagnasty

Quoth the raven named Eric Bohlman:
....
Yep, the lesson where they should have taught you that relative values for
font sizes are always relative to the *computed* size used by the enclosing
element. "font-size: 75%" means "make the font size three-quarters of what
it would have been if I hadn't specified a font size for this element." So
in your outer table, the font size is 75% of what it would be outside the
table (in your example, that means 75% of the browser's default size),
Click to expand...

Isn't is true that (in a good browser, I suppose) a table will inherit
from body, rather than "browser's default size?" IOW, if the author
mistakenly assigns a /body/ font of 75%, the outer table is 75% of
75%, and the inner table is 75% of 75% of 75% .. well, you get the idea.

But by this time, I've left for another site I can read.
 
E

Eric Bohlman

Isn't is true that (in a good browser, I suppose) a table will inherit
from body, rather than "browser's default size?" IOW, if the author
mistakenly assigns a /body/ font of 75%, the outer table is 75% of
75%, and the inner table is 75% of 75% of 75% .. well, you get the
idea.
Click to expand...

That's why I qualified my statement with "in your example" since I don't
recall him setting a font size on the body. You're right, of course, that
had he done so, his page would *not* be in a state of grace.
 

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

Similar Threads

Can someone tell me if this a real tracker? Or is it one designed to show you a different message at certain times, ie. acting like one? 0
Positioning CSS components 1
Javascript DOM 1
How to wrap <td> content . 16
Having trouble centering contents of td ? 3
How to have two html audio players on one page? 0
I need help fixing my website 2
Stuck with html and css 25

Members online

Total: 31 (members: 2, guests: 29)
Robots: 364

Forum statistics

Threads
473,755
Messages
2,569,537
Members
45,020
Latest member
GenesisGai

Latest Threads

Top