Header. Font Size and Line Height

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • shapper

    Header. Font Size and Line Height

    Hello,

    I created the following header:


    Where Font Size is the same as Line Height: 2.0em.

    Shouldn't the border be next to the text?

    Thanks,
    Miguel
  • Jukka K. Korpela

    #2
    Re: Header. Font Size and Line Height

    shapper wrote:
    I created the following header:

    >
    Where Font Size is the same as Line Height: 2.0em.
    No, both are declared using the same expression, but it has different
    meanings.

    For font-size, the em unit means the size of the font of the parent element.
    Shouldn't the border be next to the text?
    Even if you set line-height to 1em, making it equal the font size, the
    border does not normally touch letters. Remember that the font size is the
    total height of the font, normally encompassing ascenders, descenders, and
    diacritic marks. A letter like "H" should be expected to have a height that
    is notably less than the font size.

    Actually if the text contains letters like "j" and "Å", those letters might
    extend to the border (set for an element with line-height: 1em) and even a
    little beyond. But most letters - for the Latin script at least - have
    spacing below and above them.

    Yucca

    Comment

    • shapper

      #3
      Re: Header. Font Size and Line Height

      On Aug 18, 7:07 pm, "Jukka K. Korpela" <jkorp...@cs.tu t.fiwrote:
      shapper wrote:>
      Where Font Size is the same as Line Height: 2.0em.
      >
      No, both are declared using the same expression, but it has different
      meanings.
      >
      For font-size, the em unit means the size of the font of the parent element.
      >
      Shouldn't the border be next to the text?
      >
      Even if you set line-height to 1em, making it equal the font size, the
      border does not normally touch letters. Remember that the font size is the
      total height of the font, normally encompassing ascenders, descenders, and
      diacritic marks. A letter like "H" should be expected to have a height that
      is notably less than the font size.
      >
      Actually if the text contains letters like "j" and "Å", those letters might
      extend to the border (set for an element with line-height: 1em) and even a
      little beyond. But most letters - for the Latin script at least - have
      spacing below and above them.
      >
      Yucca
      So should I use margin on a header to specify a top and bottom
      spacing?

      Thanks,
      Miguel

      Comment

      • Jukka K. Korpela

        #4
        Re: Header. Font Size and Line Height

        shapper wrote:
        So should I use margin on a header to specify a top and bottom
        spacing?
        Pardon? You quoted my entire message, so it is impossible to see how your
        question relates to it and whether you understood any of it.

        And taken in isolation, your question looks rather trivial. Spacing can be
        achieved using margins or padding or both. What's so special here that you
        need to ask?

        Of course line-height can _also_ be used for spacing. What made you think it
        could not? But it's not wise to use it for anything that can be achieved
        using margin or padding, since line-height affects... well, line height,
        i.e. _line_ spacing. This is quite important when the text may get divided
        into two or more lines, as it usually can (there is no lower limit to window
        width that people may use).

        Yucca

        Comment

        • dorayme

          #5
          Re: Header. Font Size and Line Height

          In article
          <0639b2bc-5410-4696-a2d0-fdf1e82cb859@m4 5g2000hsb.googl egroups.com>,
          shapper <mdmoura@gmail. comwrote:
          So should I use margin on a header to specify a top and bottom
          spacing?
          Use top and bottom padding.

          --
          dorayme

          Comment

          • Ben C

            #6
            Re: Header. Font Size and Line Height

            On 2008-08-19, dorayme <doraymeRidThis @optusnet.com.a uwrote:
            In article
            ><0639b2bc-5410-4696-a2d0-fdf1e82cb859@m4 5g2000hsb.googl egroups.com>,
            shapper <mdmoura@gmail. comwrote:
            >
            >So should I use margin on a header to specify a top and bottom
            >spacing?
            >
            Use top and bottom padding.
            I suppose on the assumption that he wants the spacing between the text
            and the border.

            But usually margins are a good choice because they collapse-- for
            example bottom margin of H1 collapsing with top margin of the P that
            follows it.

            Comment

            • shapper

              #7
              Re: Header. Font Size and Line Height

              On Aug 19, 7:34 am, Ben C <spams...@spam. eggswrote:
              On 2008-08-19, dorayme <doraymeRidT... @optusnet.com.a uwrote:
              >
              In article
              <0639b2bc-5410-4696-a2d0-fdf1e82cb...@m4 5g2000hsb.googl egroups.com>,
               shapper <mdmo...@gmail. comwrote:
              >
              So should I use margin on a header to specify a top and bottom
              spacing?
              >
              Use top and bottom padding.
              >
              I suppose on the assumption that he wants the spacing between the text
              and the border.
              >
              But usually margins are a good choice because they collapse-- for
              example bottom margin of H1 collapsing with top margin of the P that
              follows it.
              Thank You!

              I will use margin ... the borders where just a visualization helper.

              Miguel

              Comment

              Working...