www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 25

Thread: Font Weight Property

Hybrid View

  1. #1
    Join Date
    Nov 2002
    Posts
    82

    Font Weight Property

    I'm getting a bit frustrated with this whole Font-weight property. I read on websites that it can accept values like 100-900, bold, bolder, normal, and lighter. I also see that compatible with NN 4.0 and IE 4.0 (Im' running IE 5.5 and Mozilla 1.2). If this is true, then please take a look at this page:

    www.wblondon.com/telconstar99/test.html


    For me, it looks like 100-500, Normal, and Lighter are all the same. It also looks like 700-900, Bold, and Bolder are also the same. The value of 600 looks slightly less bold.

    Why doesn't the property work as it was supposed to?

    Thank you for your help.
    Thank you HTML Goodies and all the regulars on the forums. I've learned much from you guys and am definetly a much better webmaster because of your dedication.

    -Tres London

  2. #2
    Join Date
    Dec 2002
    Location
    Seattle, WA
    Posts
    1,676
    it also depends on what font size you use

    the smaller the size the more similar the weights are
    the larger the size the more different the weights are

  3. #3
    Join Date
    Nov 2002
    Posts
    82
    I increased the font size to 37, then to 57. I could see no changes. For the size 57 tests, check out:

    http://wblondon.com/telconstar99/test2.html

    Any other ideas?
    Thank you HTML Goodies and all the regulars on the forums. I've learned much from you guys and am definetly a much better webmaster because of your dedication.

    -Tres London

  4. #4
    Join Date
    Dec 2002
    Location
    Seattle, WA
    Posts
    1,676
    o'reilly reference

    normal is equal to 400
    bold is equal to 700

    other settings (bolder and lighter) let you specify a weight relative to the parent element's weight.

  5. #5
    Join Date
    Nov 2002
    Posts
    984

    Re: Font Weight Property

    Originally posted by telconstar99
    I read on websites that ... ... compatible with NN 4.0 and IE 4.0 (Im' running IE 5.5 and Mozilla 1.2).
    Don't belive everything you read
    Most of these webplages only test if a browser implements something in very simple testcases that certainly doesn't test all aspects of the property.

    They have probaly just tested the 400=normal and 700=bold and happily conclude that it works in all browsers.

    A fine scale from 100-900 however is virtually non exsistant even in modern browsers.
    // Stefan Huszics

  6. #6
    Join Date
    Nov 2002
    Posts
    82
    Thanks Stefan. I wish these modern browsers could implement it. Now I'm rather stuck. I'm looking to change the font of the text found on the this page:

    http://telconstar.com

    It's too bold right now, however, at normal, it's too light! I just wish browsers came stocked with more fonts! These web-safe fonts are a hindrance.

    Oh well, back to the drawing board.
    Thank you HTML Goodies and all the regulars on the forums. I've learned much from you guys and am definetly a much better webmaster because of your dedication.

    -Tres London

  7. #7
    Join Date
    Nov 2002
    Posts
    4,473
    Could it be an OS limitation, rather than a "bug in the browser"? When the browser "requests" a font, the OS supplies the closest thing it has, comparing height and weight, trying to satisfy the request.

    For example, my PC has 4 different weights for the Arial font - black, bold, narrow, and "standard".

  8. #8
    Join Date
    Nov 2002
    Posts
    82
    Good point, it might be a shortcoming with the font itself. I'm no typography expert, so I couldn't really say. It does make me wonder though.
    Thank you HTML Goodies and all the regulars on the forums. I've learned much from you guys and am definetly a much better webmaster because of your dedication.

    -Tres London

  9. #9
    Join Date
    Nov 2002
    Posts
    984
    Originally posted by gil davis
    Could it be an OS limitation, rather than a "bug in the browser"? When the browser "requests" a font, the OS supplies the closest thing it has, comparing height and weight, trying to satisfy the request.

    For example, my PC has 4 different weights for the Arial font - black, bold, narrow, and "standard".
    A plausable theory I would say.
    But still, peaople are not likely to have 9 boldness-states of the same font, so for this to work browsers would probably have to implement it natively in the future.
    // Stefan Huszics

  10. #10
    Join Date
    Dec 2002
    Location
    Perth, Western Australia
    Posts
    55
    I made a new variant, on the same page. http://newsdf.tripod.com/webforum/onebutton.html
    There are now two buttons: the old one, made using JavaScript, and the new one, made with CSS only.

    My browser reloads both!
    I didn't think that the CSS would work thusly, I thought it was only the JScript folly of a certain company with an address of 1 Microsoft Way, Redmond. But script changes only the CSS rule, I realised, so the problem lies within CSS..., or someone's interpretation of it.

    I checked Mozilla. It indeed works there. I think now that caching is the problem. May be your browser caches the image. My downloads it. I don't have caching disabled, but it doesn't work sometimes. Actually, always, when images are loaded through script, (rollovers that rely on cached preloaded images don't work and are generally very annoying over here). I also know some people do disable cache and this makes me search for another solution...

    Now, the questions.
    1. Validator says that I can't have a <div> inside an <a>, such as in the code:
    Code:
    <a href="sdf.cgi?home" class="link-n">
    	<div class="div-menu-item2">Home</div>
    </a>
    , though, like you said, I did specify display: block; in styles (does the parser account for CSS?). Am I allowed to put a <div> inside an <a>?

    2.Ran out of questions.


    ______EDIT________
    Right. Wrong thread. It will be appreciated if this is moved to the right thread, please. http://forums.webdeveloper.com/showt...&threadid=1409 after post number 6
    Last edited by King Pellinore; 01-06-2003 at 07:27 PM.

  11. #11
    Join Date
    Nov 2002
    Posts
    984
    Originally posted by King Pellinore
    Now, the questions.
    1. Validator says that I can't have a <div> inside an <a>, such as in the code:
    Code:
    <a href="sdf.cgi?home" class="link-n">
    	<div class="div-menu-item2">Home</div>
    </a>
    , though, like you said, I did specify display: block; in styles (does the parser account for CSS?). Am I allowed to put a <div> inside an <a>?
    No, the markup needs to be valid on it's own.
    But why would you want to put a div in an <a> to begin with?

    If you must have one use eg
    <a><span></span></a>
    CSS
    a, span {display:block;}


    BTW, what does this have to do with fontboldness?
    Did you post in the wrong thread?
    Eg thisone instead http://forums.webdeveloper.com/showt...&threadid=1409
    // Stefan Huszics

  12. #12
    Join Date
    Nov 2002
    Posts
    4,473
    FWIW, I found an interesting explanation in the CSS1 spec on font weight at http://www.w3.org/TR/REC-CSS1#font-weight :
    Fonts (the font data) typically have one or more properties whose values are names that are descriptive of the "weight" of a font. There is no accepted, universal meaning to these weight names. Their primary role is to distinguish faces of differing darkness within a single font family. Usage across font families is quite variant; for example a font that you might think of as being bold might be described as being Regular, Roman, Book, Medium, Semi- or DemiBold, Bold, or Black, depending on how black the "normal" face of the font is within the design. Because there is no standard usage of names, the weight property values in CSS1 are given on a numerical scale in which the value '400' (or 'normal') corresponds to the "normal" text face for that family. The weight name associated with that face will typically be Book, Regular, Roman, Normal or sometimes Medium.

    The association of other weights within a family to the numerical weight values is intended only to preserve the ordering of darkness within that family. However, the following heuristics tell how the assignment is done in typical cases:

    If the font family already uses a numerical scale with nine values (like e.g. OpenType does), the font weights should be mapped directly.
    If there is both a face labeled Medium and one labeled Book, Regular, Roman or Normal, then the Medium is normally assigned to the '500'.
    The font labeled "Bold" will often correspond to the weight value '700'.
    If there are fewer then 9 weights in the family, the default algorithm for filling the "holes" is as follows. If '500' is unassigned, it will be assigned the same font as '400'. If any of the values '600', '700', '800' or '900' remains unassigned, they are assigned to the same face as the next darker assigned keyword, if any, or the next lighter one otherwise. If any of '300', '200' or '100' remains unassigned, it is assigned to the next lighter assigned keyword, if any, or the next darker otherwise.
    So, the weight is dependent on the fonts available on the client.

  13. #13
    Join Date
    Nov 2002
    Posts
    984
    Thanks for the heads up Gil
    // Stefan Huszics

  14. #14
    Join Date
    Nov 2002
    Posts
    82
    Yeah, thanks for the heads up.

    BTW, why are you a NS 4.X die-hard user? Aren't there better browsers out there?
    Thank you HTML Goodies and all the regulars on the forums. I've learned much from you guys and am definetly a much better webmaster because of your dedication.

    -Tres London

  15. #15
    Join Date
    Nov 2002
    Posts
    4,473
    Originally posted by telconstar99
    Aren't there better browsers out there?
    IMHO, no (obviously).

    You'd have to define "better", wouldn't you? If "better" is defined by W3C recommendations, then NS 4 is deficient. You have to remember that NS 4 was cutting edge Dynamic HTML when it was first released in 1994. It pre-dates IE 4 and the CSS1 recommendations (1996).

    There are more capable browsers, but mostly all I want is fast access to real information, not fluff and advertising. I don't much care what font or color it is.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles