Centering content in Netscape 7, Opera 7.51 and Firefox 0.9

[valegooner]

After searching forums etc it seems that the accepted way of centering content is something along the following lines:

/*Division tags*/
body {
color: #000;
background: #fff;
text-align: center;
margin: 0px;
padding: 0px; /* Keeps Opera in check */
}

#main {
position: relative;
margin: 10px auto 10px auto;
padding: 0px;
width: 720px;
height: auto;
text-align: center;
}


However this does not work for the browsers listed in the subject, the content appears on the left and infact dissapears entirely in netscape when the window size shrinks. Any ideas?

[sharkey]

Try changing the margin in the main div to this margin:0 auto;

[Neczy]

i believe you can also say

margin-left: auto;
margin-right: auto;

But I forget lol.

[davidbrent]

body {
color: #000;
background: #fff;
text-align: center;
margin: 0; /* for null value, you do not need to put the units in */
padding: 0;
}

#main {
position: relative; /* no need for this */
margin: 10px;
margin-left: auto;
margin-right:auto;
padding: 0px;
width: 720px;
height: auto;
text-align: center;
}


Opera is not familiar with the margin: 10px auto et cetera so you can get around it as above.

Hope that helps.
Best Wishes,
David