Headers in CSS, text shifting difference IE

[kenbo64]

Set up H1 style sheet in head section.
Set up body text style sheet in head.
Wrote text - made first line H1 then full paragraph and remainder of text as bodytext style.
OK in IE6 but all text (header & bodytext) shift down.
Without H1 text does not shift.
Hope this makes sense

[Marshall]

Hi kenbo64, welcome to WebmasterWorld.

Each browser has its own default margins and padding for tags. The easiest thing to do, IMHO, is set the desired margins and padding in your CSS to make them uniform across browser platforms.

Marshall

[kenbo64]

Thanks Marshall - you are talking to a complete novice can you explain further

[Marshall]

In your CSS, simply assign the margins to the <h>, and if you want, the <p> tags (or any other tags for that matter) to achieve a uniform look across browser platforms.

h1, h2, h3, h4, h5, h6, p {
margin: 10px auto 10px auto; /* reads top, right, bottom, left; */
}

You can also shortcut this to

h1, h2, h3, h4, h5, h6, p {
margin: 10px auto; /* reads top/bottom, right/left; */
}

You can do the same with the padding if necessary:

h1, h2, h3, h4, h5, h6, p {
padding: 10px auto; /* reads top/bottom, right/left; */
}

But try the margins first before changing the padding.

The number I pick, 10px, is arbitrary. Use what you need to achieve the look you want. The fact different browser assign different margins and padding to elements is a pain, but not always crucial unless you have a fixed design layout they you do not want to shift.

Marshall

[kenbo64]

Thanks again will try tomorrow

[kenbo64]

Brilliant - it worked - Thanks