small problem

[alex_gomy]

for some reason when i put text in a <H> tag on my site, it pushes the text down?? i have no idea why its doing it. The code for my <h> tags is:

H1, H2, H3, H4 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
}
H1 {font-size: 14px; color:#FF6600;}
H2 {font-size: 12px; color:#FF6600;}
H3 {font-size: 12px;}
H4 {font-size: 12px;}

If i put say <H1> </H1> around some text it pushes it down about 1/2 inch.

anyone got any ideas why its doing it??

[tommylogic]

it's probably your browser.. do you have a link?

[Toon]

Originally Posted by alex_gomy

for some reason when i put text in a <H> tag on my site, it pushes the text down?? i have no idea why its doing it. The code for my <h> tags is:

H1, H2, H3, H4 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
}
H1 {font-size: 14px; color:#FF6600;}
H2 {font-size: 12px; color:#FF6600;}
H3 {font-size: 12px;}
H4 {font-size: 12px;}

If i put say <H1> </H1> around some text it pushes it down about 1/2 inch.

anyone got any ideas why its doing it??

Why use uppercase? I would start there

[Marc]

<h> tags have a top margin, you just need to set this to zero i.e.

h1{
margin:0 0 15px 0;
}

[tommylogic]

I forget that people forget to clear all their margins at the top of their CSS... I recommend starting your CSS file like so:

body, h1, h2, h3, h4, p, ul, li {
    margin: 0px;
    padding: 0px;
}

[Marc]

Good call, all of my style sheets currently start with:

body, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, img, strong, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, tr, th, td {
margin:0;
padding:0;
border:none;
}

[alex_gomy]

Sweet that worked... cheers for being helpful all.

[misterm]

Originally Posted by tommylogic

I forget that people forget to clear all their margins at the top of their CSS... I recommend starting your CSS file like so:

body, h1, h2, h3, h4, p, ul, li {
    margin: 0px;
    padding: 0px;
}

Or even quicker

*{
margin:0;
padding:0;
}

This will reset all the standards padding/margin values off all browsers and makes them render pretty much alike. Just in case, stay aware of the box-model.

[Marc]

The universal selector will reset styles on all tags, so bear in mind that you will have to re-style everything...

[tommylogic]

yeah exactly... some what overkill