Connecting Tech Pros Worldwide Help | Site Map

Header. Font Size and Line Height

 
LinkBack Thread Tools Search this Thread
  #1  
Old August 18th, 2008, 04:25 PM
shapper
Guest
 
Posts: n/a
Default Header. Font Size and Line Height

Hello,

I created the following header:
http://www.27lamps.com/Beta/Typography/Typography.html

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

Shouldn't the border be next to the text?

Thanks,
Miguel

  #2  
Old August 18th, 2008, 06:15 PM
Jukka K. Korpela
Guest
 
Posts: n/a
Default Re: Header. Font Size and Line Height

shapper wrote:
Quote:
I created the following header:
http://www.27lamps.com/Beta/Typography/Typography.html
>
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.
Quote:
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

  #3  
Old August 18th, 2008, 07:15 PM
shapper
Guest
 
Posts: n/a
Default Re: Header. Font Size and Line Height

On Aug 18, 7:07*pm, "Jukka K. Korpela" <jkorp...@cs.tut.fiwrote:
Quote:
shapper wrote:
Quote:
I created the following header:
http://www.27lamps.com/Beta/Typography/Typography.html
>
Quote:
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.
>
Quote:
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
  #4  
Old August 18th, 2008, 09:05 PM
Jukka K. Korpela
Guest
 
Posts: n/a
Default Re: Header. Font Size and Line Height

shapper wrote:
Quote:
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

  #5  
Old August 19th, 2008, 12:45 AM
dorayme
Guest
 
Posts: n/a
Default Re: Header. Font Size and Line Height

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

--
dorayme
  #6  
Old August 19th, 2008, 06:35 AM
Ben C
Guest
 
Posts: n/a
Default Re: Header. Font Size and Line Height

On 2008-08-19, dorayme <doraymeRidThis@optusnet.com.auwrote:
Quote:
In article
><0639b2bc-5410-4696-a2d0-fdf1e82cb859@m45g2000hsb.googlegroups.com>,
shapper <mdmoura@gmail.comwrote:
>
Quote:
>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.
  #7  
Old August 19th, 2008, 03:25 PM
shapper
Guest
 
Posts: n/a
Default Re: Header. Font Size and Line Height

On Aug 19, 7:34*am, Ben C <spams...@spam.eggswrote:
Quote:
On 2008-08-19, dorayme <doraymeRidT...@optusnet.com.auwrote:
>
Quote:
In article
<0639b2bc-5410-4696-a2d0-fdf1e82cb...@m45g2000hsb.googlegroups.com>,
*shapper <mdmo...@gmail.comwrote:
>
Quote:
Quote:
So should I use margin on a header to specify a top and bottom
spacing?
>
Quote:
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
 

Bookmarks

Thread Tools Search this Thread
Search this Thread:

Advanced Search

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Popular Articles

What is Bytes?

We are a network of experts and professionals in IT and software development that help one another with answers to tough questions and share insights. Get the best answers to your questions from over 220,989 network members.