Forums

  • # December 7, 2012 at 2:30 pm

    I was wondering if CSS gurus could answer my questions about the code below which I found on the www.

    1. What does 1.5 mean in the following line?

    font:100%/1.5 Cambria, Georgia, serif; /* 16px */

    2. In the line below, I kind of have the same question ( what does 1.1429 mean), but at the same time I want to know why this figure equals to 32px for the author of the code(see his CSS comments)

    font:bold 1.75em/1.1429 ‘Proxima Nova Bold’,sans-serif; /* 28px/32px */

    Thank you so much for your help.
    This is the full code:

    body {
    color:#333;
    font:100%/1.5 Cambria, Georgia, serif; /* 16px */
    }

    h1 {
    color:#2c1c16;
    font:bold 1.75em/1.1429 ‘Proxima Nova Bold’,sans-serif; /* 28px/32px */
    margin:0.8571em 0 0; /* 24px 0 0 */
    }

    # December 7, 2012 at 2:41 pm

    1) The 1.5 is the line height. [Check it out.](http://css-tricks.com/snippets/css/font-shorthand/ “CSS-Tricks: Font shorthand”) 1.5 is the same as 150%. So in this case, if the font-size is 16px, a line-height of 1.5 = 24px.

    2) 32px = 28px * 1.1429. (It’s actually 32.0012, but close enough.)

    # December 7, 2012 at 3:08 pm

    Thank you so much!!! Now I understand. I was always wondering about the relationship between the font size and the line height. What are the criteria to determine what line height would be suitable for a certain font-size?

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag