Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > CSS line-height

Reply
Thread Tools

CSS line-height

 
 
sachaburnett@yahoo.com
Guest
Posts: n/a
 
      09-10-2006
Hi all,

I would like to know what is the most consistent way to display
additional space in between lines of text considering all the different
browsers, screen sizes, resolutions, etc...

Is it better to specify a length value such as:

line-height: 18px;

or a percentage such as:

line-height: 150%;

Thanks!

SB

 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      09-11-2006
In article
<(E-Mail Removed) .com>,
http://www.velocityreviews.com/forums/(E-Mail Removed) wrote:

> Hi all,
>
> I would like to know what is the most consistent way to display
> additional space in between lines of text considering all the different
> browsers, screen sizes, resolutions, etc...
>
> Is it better to specify a length value such as:
>
> line-height: 18px;
>
> or a percentage such as:
>
> line-height: 150%;


If you are going to use line-height (make sure you need to), use
em.

--
dorayme
 
Reply With Quote
 
 
 
 
Chris F.A. Johnson
Guest
Posts: n/a
 
      09-11-2006
On 2006-09-10, (E-Mail Removed) wrote:
> Hi all,
>
> I would like to know what is the most consistent way to display
> additional space in between lines of text considering all the different
> browsers, screen sizes, resolutions, etc...
>
> Is it better to specify a length value such as:
>
> line-height: 18px;


If you use fixed px sizes, you may not have enough room for a
reader's font size (you cannot know what it is).

> or a percentage such as:
>
> line-height: 150%;


line-height: 1.5;

--
Chris F.A. Johnson <http://cfaj.freeshell.org>
================================================== =================
Author:
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
 
Reply With Quote
 
Jukka K. Korpela
Guest
Posts: n/a
 
      09-11-2006
dorayme <(E-Mail Removed)> scripsit:

> If you are going to use line-height (make sure you need to), use
> em.


No, it is best to use just numbers. The reason is that the line-height
property is rather special. If you declare, say, line-height: 1.5 (there's
seldom a reason for such a large value, but let's pretend there is, like the
original question did), then the _declared value_ 1.5 gets inherited. This
means that if there is an element with a different font size, the
line-height value gets adapted to the font size. If you declare line-height:
1.5em (or 150%), then the _computed value_ gets inherited.

Note: This might look like a non-issue since you don't change the font size.
But you might, in a later version, without remembering to consider the
line-height impact, or someone else who maintains the page next year might
do so. Besides, even browser and user style sheets may change font size.

Actually authors _should_ generally use line-height. The reason is that
browser defaults vary rather unpredictably and are generally too small,
especially for fonts with large x height. Something like
body { line-height: 1.25; }
might be suitable in a typical case. If you think of using Verdana, stop
that, but if you don't, line-height: 1.3 is not too much.

--
Jukka K. Korpela ("Yucca")
http://www.cs.tut.fi/~jkorpela/

 
Reply With Quote
 
dorayme
Guest
Posts: n/a
 
      09-11-2006
In article <DE7Ng.9357$(E-Mail Removed)>,
"Jukka K. Korpela" <(E-Mail Removed)> wrote:

> dorayme <(E-Mail Removed)> scripsit:
>
> > If you are going to use line-height (make sure you need to), use
> > em.

>
> No, it is best to use just numbers. The reason is that the line-height
> property is rather special. If you declare, say, line-height: 1.5 (there's
> seldom a reason for such a large value, but let's pretend there is, like the
> original question did), then the _declared value_ 1.5 gets inherited. This
> means that if there is an element with a different font size, the
> line-height value gets adapted to the font size. If you declare line-height:
> 1.5em (or 150%), then the _computed value_ gets inherited.


Oooee! This is a subtlety I never knew. Right. Now I do. And will
read up on this sort of thing a bit more. I am sure that I learn
at least about five new things on alt.html a week...

--
dorayme
 
Reply With Quote
 
 
 
Reply

Thread Tools

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 On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
CSS Layout question - how to duplicate a table layout with CSS Eric ASP .Net 4 12-24-2004 04:54 PM
confused - html validates, css validates but validate css from the html causes errors Titus A Ducksass - AKA broken-record HTML 6 11-15-2004 12:59 PM
Set CSS property equal to another CSS property? Noozer HTML 10 10-13-2004 09:20 PM
Is there a way to set the a CSS property to be explicitly the same as another CSS property? Joshua Beall HTML 1 12-10-2003 07:21 PM
print.css and screen.css tom watson HTML 1 09-09-2003 02:48 PM



Advertisments