Centering a div using CSS

[Stoemp]

Hi

I'm trying to center a div using CSS. I checked out some websites and they all say the same. I tried that, but I can't manage to center the div. The code I use is:

<div class="pBodyTekst" style="border: solid 1px red; color: white; font-weight: bold; background-color: red; text-align: center; width: 80%; margin-left: auto; margin-right: auto">Chemicon antibody promotion!</div>

Maybe a little explanation what I want to do with all the styling:
-> class="pBodyTekst" is the standard styling to set the font etc.
-> the text-align is not meant to center the block, but to center the text inside
-> I try to center the block with the width and margin css properties

I tried it in a blank document without other style definitions and it didn't work either, so the other document styles are not disturbing the lay-out of the page.

What am I doing wrong?

Thanks

Steven

 

[Vragabond]

You are using wrong browser. Simple as that. IE does not understand auto values in margin and that is why it renders the page incorrectly. It should work ok in Mozilla, Opera and other standards-compliant browsers. To overcome IE's shortcomings, I suggest wrapping it in another div, which has text-align: center; Since that is improper syntax to center block elements, it will not affect other browsers but will work in IE:

<div style="text-align: center;">
  <div class="pBodyTekst" style="border: solid 1px red; color: white; font-weight: bold; background-color: red; text-align: center; width: 80%; margin-left: auto; margin-right: auto">Chemicon antibody promotion!</div>
</div>

 

[Stoemp]

OMG! Again that browser issue! I love working with CSS, but these incompatibilities freak me out!

Thanks for the help.

Steven

 

[ArkM]

But (almost equivalent

<style>
.c80 {
background-color:red;
border: solid 1px blue;
color: white; 
font-weight: bold;
text-align:center;
margin-left:10%;
margin-right:10%;
width:auto;
}
</style>

works fine in IE 5.5+...

 

[Stoemp]

Thanks ArkM. This is indeed another solution.