CSS - Problem with % text size in table cells
I have my styles set like this:
body {color: #000; background-color:#fff; margin: 3px; padding: 3px;
font-family: arial, helvetica, sans-serif; font-size: 80%;}
td, th {vertical-align: top; font-size: 80%;} The problem is that IE & Opera need to have the td & th font sizes defined while Mozilla inherits from the body (and therefore is applying 80% twice to the td's). How can I fix this? Doctype is xhtml strict.
Suzanne posted this at 14:27 — 22nd August 2003.
She has: 5,507 posts
Joined: Feb 2000
Ah, the delight of using relative font sizes. I'd suggest using keywords instead. Or dropping the body condition.
Megan posted this at 14:54 — 22nd August 2003.
She has: 11,421 posts
Joined: Jun 1999
font-size: small seems to be ignored by IE & Opera. font-size: smaller has the same problem as 80%
Crap, I thought I had this figured out before!
Megan
Connect with us on Facebook!
Suzanne posted this at 15:06 — 22nd August 2003.
She has: 5,507 posts
Joined: Feb 2000
You have a sample url? I recall having these issues for ages, too, but I haven't been doing front-end work for so long I can't recall off the top of my head what the solution was.
Of course, I don't use tables very much, either!
When I was working things out for my blog, I had issues with accumulated percentages as well, I ended up reworking the markup.
Megan posted this at 15:35 — 22nd August 2003.
She has: 11,421 posts
Joined: Jun 1999
http://www.meganjack.com/afm_131/
http://www.meganjack.com/afm_131/styles.css
Most of those links don't work because I didn't upload all the pages. Module 1 and Module 10 on the left side work. Module 1 uses div's for layout, 10 uses a table (because those items on the right side need to line up with the middle column). Notice how all the font sizes on module 10 are tiny in Mozilla, but the same as Module 1 in Opera and IE.
I am searching through the CSS-discuss archives as well.
Megan
Connect with us on Facebook!
Megan posted this at 17:49 — 22nd August 2003.
She has: 11,421 posts
Joined: Jun 1999
This seems to have worked:
body {color: #000; background-color:#fff; margin: 3px; padding: 3px;font-family: arial, helvetica, sans-serif; font-size: 80%;}
table {font-size: 100%;}
td, th {color:#000; vertical-align: top;}
Found that on CSS-disuss.
Edit: also works when you put font-size: 100% in with table, td, th together. Unfortunately, DW doesn't like this trick. It would be nice to have something that would work in there but I guess I can do with out it - I'm just worried that coworkers will see that and try to fix it with tags....
Megan
Connect with us on Facebook!
Suzanne posted this at 19:12 — 22nd August 2003.
She has: 5,507 posts
Joined: Feb 2000
I guess the table inherits 100% of the 80%? Interesting.
Sorry I missed the boat here -- self-help desk to the rescue!
m3rajk posted this at 18:24 — 23rd August 2003.
They have: 461 posts
Joined: Jul 2003
words for font sizes are like words for colors: every browser/os combo handles them differently, if they even handle all of them. while today's browser only have slight variations, there was a time when netscape wasthe only one that honored hue chnages among colors (ie: some of the names differ only in intensity, there was a time wehn lynx was still popular, ie was still an infant, etc, that only netscape (it was one of the last versions of 2.x ... yeah, this dates me, but it's when i first learned html....and then put it on the shelf and took up prgramming languages...until rather recently... that only netscape actually honored the hue changes)
just something to note.. it's why i always use hex for colors and relative sizes for size (i've heard that percent will have very slight variations.... the relative sizes so that if a user selects "larger" for the browser options, their larger is still honored, instead of either my design being forgotten by the browser or their choice ignored, depending on the preferences settings)
POSIX. because a stable os that doesn't have memory leaks and isn't buggy is always good.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.