MEM wrote: >> Look at http://fm.no-ip.com/auth/Font/font-rounding.html in each of >> your >> installed browsers and you may see that more than two significant >> digits to >> em font-sizes are an invitation for inconsistent results. If you stick >> to two >> significant digits and take what you learn from that URL into account >> you >> might get acceptable results cross-browser. > > It was amazing to see how much different they can get. I've not seen any EM > units however. (where they the same as the %, since 100%=1em ?)
Default = 100% = 1em until you have nested elements. The first element in the tree that can have a size (font-size and height) is the HTML element, then the BODY element and then any other elements within the body of the document. > I've seen that .pt are quite inconsistent. pt (points) change apparent visual size via your DPI setting. > Px are precise. (but they not > scale on some browsers) > and the keywords small...etc (are quite nice as well). > The percent, seems to be quite nice also, if we stick with 2 digits. And > because of this also, I associate EM with %. Hope to get it right. Maybe this will help with your understanding. All sizes adjust according to your browser text (font) size settings. This also affect the height given to nested elements, even if it is just a DIV. <http://css-class.com/test/css/text/size.htm> Notice how nested elements have a different size when inside elements that have a smaller or larger value in ems. Notice also how Default, 100%, and 1em are all the same size. Please observe that the text with font-size: 0.5em within the container with font-size: 1.5em is the same size as the text with font-size: 1.5em within the container with font-size: 0.5em. >> I grepped font-size from >> http://www.chequedejeuner.nuvemk.com/lib/css/main.css and found 31 >> lines, >> plus a few with just font:. That's probably more than necessary. >> Simplify and >> see what happens. > > What could we do to simplify? Should I remove some font-sizes and let them > been hierarchy applied? The only font-size that I use for this page, <http://css-class.com/test/> is this. h1 {font-size:160%;} h2 {font-size:125%;} h3 {font-size:115%;} h4 {font-size:100%;} a[href="#navigation"] {font-size:140%;} .float2 h3 {font-size:140%;} #wrapper2+div+div a {font-size:small;} #wrapper1+div p {font-size:143%;} Notice how I am only targeting specific elements (ones that contains text) and not whole containers or boxes. This is how you simplify. The below two do nothing and are not really needed. body {font-size: 100%;} #navigation ul {font-size: 100%;} Attempting to use ems in the first place when learning leads to the long path of understanding font-size. My first rule in CSS which I learned the hard way is, *LESS IS BETTER*. -- Alan http://css-class.com/ ______________________________________________________________________ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
