Line Breaks after H1,H2, Hx tags

h1 h2 h3 line breaks

[cuce]

I was wondering if there is any way that I can control the space below and above H1,H2, etc... tags besides without having to use this trick..

<h1 style="display:inline;">heading</h1><br/>

I'm finding the breaks are way too big the majority of the time and I don't want to litter my code with <br/>'s if anyone can help that would be greatly appreciated.

Thanks

[scottmack]

Apply margin-top: 0px or something to the H1 ...
Same on margin-bottom

[Span]

h1,h2,h3,h4,h5 {
margin:0;
padding:0;
}

..and then..

h1 {
padding:3px;
}

and so on. If you do it this way, you don't need the display property and the linebreak.

[cuce]

thanks you guys i can't beleive i never thought of that!

this was what i ended up using, since some of my
Hx tags had left and right margin/padding.

h1,h2,h3,h4,h5 {margin-top:0px;margin-bottom:0px;}
p{margin-top:0px;margin-bottom:0px;}

This forum rocks.

[sifredi]

You can use an asterix (*) to control all elements in your CSS. Start with

* {margin: 0; padding: 0;}

In your document, and all default margins and padding will be set to 0. Then it's much easier to create custom margins to each tag.

[isorg]

* {margin: 0; padding: 0;}

Trouble I have with this is that (predictably) the whole page is squashed together and you have to manually specify the padding and margin for every element. That's not the problem... problem is that I don't know what the default values are for each browser. I know that Firefox and IE have different default values for <P> padding and margin. Does anyone know/estimate what they are?

[sifredi]

Does anyone know/estimate what they are?

Go ahead a dig it out. I would say that hx and p are probably about the same, but other elements such as lists and body are very different in each browser. The question itself justifies the method of using asterix(*) to prevent browser dissimilarities.

Just my 2c