DIV layout page allignment., in firefox and IE? Options

[vintage-toile]

i've created a new DIV layout for myspace...and it's perfectly alligned in internet explorer, but in firefox, the navigation section is about 200px out of line.
here's the part of the coding which needs to be changed somewhere:

CODE

body {
background-attachment:scroll;
background-color:ef2d8f;
cursor:crosshair;
font-weight:normal;
}

a:link, a:visited, a:active {
font-family:tahoma;
font-size:13px;
font-weight:bold;
color:cecdc9;
text-decoration:none;
}

a:hover {
font-family:tahoma;
font-size:13px;
font-weight:bold;
color:050422;
text-decoration:none;
}

a.nav:link, a.nav:visited, a.nav:active {
text-decoration: none;
    font-family:tahoma;
    font-style: normal;
    font-variant: small-caps;
    font-size: 15px;
    line-height: 20px;
    text-align: center;
    color:FFFFFF!important;
    background-color:330a1e;
    border-left: 10px solid;
    border-color:fcccf8 !important;
    border-right: 10px solid;
    border-color:fcccf8 !important;
    cursor: crosshair;
    display: block;
    margin: 0;
        width: 200px;
    margin-bottom: 0em;
    padding: 0px;
    padding-left: 1px;
    padding-right: 1px;

    }


a.nav:hover {text-decoration: none;
    font-family:tahoma;
    text-align: center;
        font-variant: small-caps;
    font-style:uppercase;
    font-size:18px;
    line-height:20px;
    color:FFFFFF !important;
    background-color:330a1e ;
    border-left: 10px solid;
    border-color:fcccf8 !important;
    border-right: 10px solid;
    border-color:fcccf8 !important;
    cursor: crosshair;
    display: block;
    margin: 0;
        width: 200px;
    margin-bottom: 0em;
    padding: 0px;
    padding-left: 1px;
    padding-right: 1px;}


.header {
position:absolute;
overflow:auto;
top:120px;
left:90px;
background-color:transparent;
border:0px;
}

.navigate {
position:absolute;
overflow:auto;
top:240px;
left:633px;
background-color:transparant;
font-family:times new roman;
font-size:10px;
color:black;
font-weight:normal;
width:300px;
height:200px;
padding:0;
}

.main {
position:absolute;
overflow:auto;
top:665px;
left:120px;
background-color:transparant;
font-family:tahoma;
font-size:12px;
color:FFFFFF;
font-weight:normal;
height:230px;
width:475px;
margin:0;
padding:0;
}


.burnbook {
position:absolute;
overflow:auto;
top:625px;
left:633px;
background-color:transparant;
font-family:tahoma;
font-size:12px;
color:FFFFFF;
font-weight:normal;
height:240px;
width:250px;
margin:0;
padding:0;
}

and it's most likely in the navigation bit...(duhh..)
but i've changed the coding in the navigation to left:50%;
margin-left:000px; as recommended by insurmountable, and for some reason this has now misaligned the layer to the same amount in IE.

does anyone know how i can solve this? and where to put the new amounts so that the entire layout is alligned in all browsers?

[vintage-toile]

i think it's the z-index.
i was just wondering really if there was any almost fixed idea for everything to be aligned in all version of explorers, firefox is always one to annoy me with navigation
thankyou very much for the offer, but i know how time consuming it is and this layout was just for a friend, she'll probably move onto another one soon and i'd hate your hard work wasted, it takes a lot of though.
but thanks