The align property does not seem to work correctly in Firefox

[DeathByPixels]

I am trying to get the main table to sit in the centre of the page, it works in IE but not in Firefox. When I preview in Firefox, the table sits on the left of the page. How do I get the table to sit in the middle of the page in Firefox like it does in IE?

Here's the code I have so far:

<!-- Main table -->
<table class="main_table" width="800" border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td><!-- Header --><table width="800" height="250" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td valign="top" align="left"><img src="img/shimmyst_green_header.gif" width="800" height="250" /></td>
  </tr>
</table><!-- END Header -->
</td>
  </tr>
  <tr>
    <td><!-- Blog List --><table class="blog_list" width="800" height="30" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>&nbsp;</td>
  </tr>
</table><!-- END Blog List -->
</td>
  </tr>
  <tr>
    <td><!-- Main Content Body --><table width="800" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="200">&nbsp;</td>
    <td width="400">&nbsp;</td>
    <td width="200">&nbsp;</td>
  </tr>
</table><!-- ND Main Content Body -->
</td>
  </tr>
  <tr>
    <td><!-- Footer --><table width="800" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>&nbsp;</td>
  </tr>
</table><!-- END Footer -->
</td>
  </tr>
</table>
<!-- END Main Table -->

Obviously I have the relevant head and body tags, I'm just showing you the main table with nested tables here. I am fairly new to coding and have been teaching myself. I also am using a CSS stylesheet, and as far as I can see I don't think I can get the table to align to the centre of the page by using CSS, but if there is a way then I'll be happy to know about it.

[BLiZZaRD]

Just helping someone else with a similar problem, and it seems that yes it can be solved by CSS...

These are the links I gave the other member to look over:

http://www.dynamicdrive.com/forums/s...ead.php?t=9202

http://www.dynamicdrive.com/forums/s...ead.php?t=6648

http://www.dynamicdrive.com/forums/s...ead.php?t=4735

On that last one, pay particular attention to the last post (by Mike)

[djr33]

<div align="center">
<!-- table code goes here -->
</div>

[DeathByPixels]

Thanks, the div tag worked. I'm not knowledgable about div tags so I will look at that in more detail.

[djr33]

Well... not sure what the align is doing in the table.... not sure why it's not working. The align can either align the contents of the table, or align the item itself... not sure which it was doing in that case (i think in the table command it does the table and in the td (cell) command it does the contents, but... not sure).
Anyway, just putting it inside something will make everythign in that div centered, including the table... so... yeah.

[Twey]

The align property is deprecated, and should be replaced with the CSS text-align. However, this applies only to inline elements. Block-level elements such as tables should be centred by setting both their left and right margins to auto.

[DeathByPixels]

Okay the auto property worked but in DreamWeaver it says it's not supported by Netscape and I'd like to have my layout be supported by all major browsers if possible.

[Twey]

Insofar as I'm aware, it's wrong.

[DeathByPixels]

So DreamWeaver is not correct?

[Twey]

I wouldn't be at all surprised. Don't sound so incredulous, it's not perfect -- in fact, far from it.

Setting the horizontal margins to auto is the pretty-much-universally-accepted way of centring block-level elements. If Netscape doesn't support the "auto" value for margins, a lot of the web is going to look very messed up in it.