CSS and font sizes in lists (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets and Accessibility



Message


slbergh -> CSS and font sizes in lists (5/23/2003 13:30:12)

I' m switching all of my web pages over to CSS-based. My department is also concerned about Section 508 accessibility, so I' m using " em" for my font size units instead of " pt" or " px" . The problem I' m running into is that if i specify the <li> font size in em, nested lists display smaller and smaller text.

Example

What can I do, besides use a fixed font size (an accessibility no-no), to get all my text the same size?

Sherry




abbeyvet -> RE: CSS and font sizes in lists (5/23/2003 16:30:43)

em' s still have quite poor cross browser support and you might be better going with percentages instead.

One way to control this problem is to define a text size in the body selector, and allow this to be the base text size for all your main text - lists, paragraphs etc. Thus you do not need to define any text size at all for the p, a or or ul selectors, if it is undefined they will inherit their size from the body selector. I find 75%-80% works quite well for this, depending on what font you are using.

Then you define heading text, or any text you wish to display larger than this, by using 110% or 120% in the relevant selector. This will be taken as a percentage of the size defined in the body selector - so it will be 110% 0r 120% of 75%, if you know what I mean.

You still need to test in a range of browsers, but it is easier to work this way than by trying to define the size of each individiual element.




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.046875