CSS Forum

**RoLLiNLoW54** · 10-10-2005, 03:14 AM

hey guys, i'm having trouble with line spacing coding my latest site. the problem is, in IE, the lines are aligned 'correctly' with very little vertical space between the line breaks. in firefox, there is extra space. i have attatched an image to show you what i'm talking about

the only CSS i have specified for the text is this:

Code:

.galleriesText
{
margin: 0px;
padding: 0px;
color: white;
font-family: Arial, Verdana, Sans Serif;
font-size: 11px;
}

and the HTML is:

Code:

<span class="galleriesText">dolphy day 2005 (132 images)<br />
</span>
<span class="galleriesText">dolphy day 2005 (132 images)
</span>

**gringo** · 10-10-2005, 03:42 AM

Hi RoLLiNLoW54,

try using line-height in your css

**RoLLiNLoW54** · 10-10-2005, 01:31 PM

Thanks, Gringo! I knew there was an attribute I was missing I just couldn't figure out which one it was.

**RoLLiNLoW54** · 03:25 PM

okay, i've got another problem. i played with the line height and still cannot get it to match up. they are much closer, but still pose a problem.

heres the difference between the fox and IE:

what i'm trying to accomplish is what firefox gets right. IE, the lines are squished together too much..

heres the CSS:

Code:

#galleriesTextContainer
{
height: 130px;
margin: 0px;
padding: 0px;
margin-left: 8px;
line-height: 8pt;
}

.galleriesText
{
margin: 0px;
padding: 0px;
color: white;
font-family: Arial, Verdana, Sans Serif;
font-size: 11px;
}

and the HTML:

Code:

<div id="galleriesTextContainer">
     <span class="galleriesText">dolphy day 2005 (132 images)<br />dolphy day 2004 (101 images)<br />buffalo wild wings (47 images)<br />lemoyne 2005 (425 images)<br />lemoyne 2004 (28 images)<br />lemoyne 2003 (147 images)<br />syracuse nationals 2004 (43 images)<br />nyc / jersey 2005 (245 images)<br />minutes monte (29 images)<br />my truck (67 images)<br />phil's t-type (70 images)
    </span>
</div>

**sameer785** · 12:10 AM

Both browsers, Firefox and IE, gave exactly the same line height to me. I tested it in psp using guides. Here're the images.

**RoLLiNLoW54** · 10-11-2005, 12:12 AM

weird, im getting a 3 pixel line space in IE, and a 4 pixel linespace in Firefox. i've tested on several different computers and IE is coming up short in each case.

**Mooofasa** · 10-12-2005, 02:46 AM

Try using min-height and max-height within your line-height.

**RoLLiNLoW54** · 10-12-2005, 04:05 AM

Quote:

Originally Posted by Twitch

Try using min-height and max-height within your line-height.

hey guys, i 'fixed' (hacked) it. for anyone interesting in how... i just used a font size switch like so:

Code:

line-height: 8pt;
font: 8pt/9pt arial,helvetica,sans-serif;

**Mooofasa** · 10-12-2005, 12:53 PM

I don't particularly work with pt, as I feel px to be more accurate and inline with the rest of the coding. You quoted my post, yet put nothing. And the switch method is something I have never thought of nor used.

**RoLLiNLoW54** · 10-12-2005, 01:42 PM

Quote:

Originally Posted by Twitch

I don't particularly work with pt, as I feel px to be more accurate and inline with the rest of the coding. You quoted my post, yet put nothing. And the switch method is something I have never thought of nor used.

whoops, sorry bout that. accidentally hit the quote instead of reply