Removing gaps between lines using H1...

[Zitchas]

OK, my problem is thus: I've got a number of lines formated using various H1, H2, etc commands, and I have noticed that whenever the previous line's H code was closed and the next line uses one, there is a significantly larger than normal (or desired) gap.

That section of code is as follows:


<BR><H2>Welcome To The
<BR>Land Of</H2>
<BR><H1>Sancarna Gy</H1>
<BR><H3>The Land of Storms</H3>
<BR>
<BR><H5>This page is dedicated to....


In that segment the unusualy large gaps occur between the "Land of < /H2> line and the following line, and likewise between that (the < BR>< H1>Sanc...) line and the one following it.

It sort of fixes itself if I take out the BR commands, but I was under the impression that it's best if I mark line breaks like that. Do the H commands incorporate some kind of line changes or something?

Note: I am also using css, the relevant H commands have been defined through that as follows:


H1 {FONT-SIZE: 28PT;COLOR: #000000;TEXT-ALIGN:CENTER;FONT-WEIGHT: BOLD;LINE-HEIGHT: 22PX;}
H2 {FONT-SIZE: 20PT;COLOR: #222222;TEXT-ALIGN:CENTER;FONT-WEIGHT: MEDIUM;LINE-HEIGHT: 22PX;}
H3 {FONT SIZE: 14PT;COLOR: #222222;TEXT-ALIGN:CENTER;FONT-WEIGHT: DEMI-LIGHT;LINE-HEIGHT: 0PX;FONT-STYLE: ITALIC;}
H4 {FONT SIZE: 14PT;COLOR: #222222;TEXT-ALIGN:CENTER;FONT-WEIGHT: EXTRA-LIGHT;LINE-HEIGHT: 18PX;}
H5 {FONT SIZE: 12PT;COLOR: #222222;TEXT-ALIGN:LEFT;FONT-WEIGHT: EXTRA-LIGHT;LINE-HEIGHT: 18PX;}


Anyway, if anyone could provide any help or advice for getting rid of that huge gap, it would be much appreciated.


The full web site (such as it is, so far) is available online, although it's nowhere near finished. (link available on request, although I'd rather not post it on open boards at the moment)

If relevant, I'm using Firefox 1.0.7

Thanks for any help.

[NogDog]

Get rid of the <BR> tags. They are only needed when you want to force a line break within a block-level element. (By default, all of the H# elements are block-level, which means they will display in their own block of space.) You can then add further spacing control by using the CSS attributes margin-top, margin-bottom, padding-top, and/or padding-bottom for your heading elements.

[Zitchas]

OK. Thanks for the info.

[Zitchas]

All right, I removed the extra BR 's where I had the extra space and it works nicely now.

Thanks for the explanation, too.