Center a table with a fixed position

Hey all, i'm trying to center a table in a fixed position in a page but i am failing badly. How do 开发者_运维技巧i do this!?!? here's what i've done...

http://pastebin.com/cjAqkyjg

If you know the size of the element (for example 200 x 100 px), you can center it using percentages and a negative margin that is half the size:

.Centered {
  position: fixed;
  left: 50%;
  top: 50%;
  margin-left: -100px;
  margin-top: -50px;
}

Here's a demo: http://jsfiddle.net/8pt4p/15/.

You need some CSS to make it work properly (this is just for the demo, so you'll need to apply an id to your elements):

CSS:

div#navigation {
    position: fixed;
    border: 1px solid blue;
    width: 100%;
}

div#navigation table {
    border: 1px solid red;

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

HTML:

<div id="navigation">
    <table border="0" cellspacing="0" cellpadding="0">
        <tr>
            <td valign="top">
                <img src="Images/navigation.png" />
            </td>
        </tr>
    </table>
</div>

You need to put a "top" and "left" css property on the div along wit fixed.

You ought to be able to do it like this:

.centered {
  position: fixed;
  left: 0;
  right: 0;
  margin:0 auto;
  width: 500px;
  height: 500px;
  background: blue;
}

Unfortunately some browsers (Opera, IE9 (IE8 does it right)) get it wrong.