margin-left for centering

Centering stuff on the page

[D_Blackwell]

Certain elements don't always want to do what I think they should. As an example -- I want this to center in the window:

p.faq {
border: 10px outset teal;
width: 90%;
margin-left: 10%;
font-size: 1.2em;
font-family: Arial; line-height: 1.5em;
background-image: url(../images/parchment.jpg);
margin-top: 2.5em;
text-align: justify;
padding: 2em;
}

I started with width: 90%; and margin-left: 5%; -- which did not work?

To center in Explorer and Opera I had to go to margin-left: 10%; --why?

Netscape 7 did exactly what it was told and now the page runs way wide.

What do I do?

[BlobFisk]

Welcome to WebmasterWorld, D_Blackwell!

The parent element may need to be given a width value of 100%. Also, try setting display:block; to the <p>.

[D_Blackwell]

BlobFisk - Thanks - Neither of those had any impact, but in continuing to try and determine why this situation ocurs only occasionally, I may have discovered part of the answer. I eliminated width: altogether and substituted margin-left: 10% and margin-right: 10%. This resolved the problem and everything centers exactly as I want now. Only tested on one problem page thus far. (Other pages may not be quite the same issue.? (Perhaps I only occasionally try to center through width: and only occasionally have the problem? [Inconsistent design - inconsistent issues]) I still don't understand why it worked "correctly" in IE in the first place. I always set body {margin: 0; padding: 0;}.

[drbrain]

Are you using a DOCTYPE with URL? IE6 is probably using its broken box model.