Header & Table Alignment Options

[diav]

Hey there, I'm having difficulty with my header and table alignment. This is the first layout I've coded for Firefox (I used to do everything in IE but I switched over to FF now). I'm currently using the Generator style (S1) on a free account.

I'm trying to center my header (to no avail) and trying to move my entries down by 625px (under the header). My codes aren't working (see http://chewy-cc.livejournal.com).

Here are my codes below:

CODE

GLOBAL_HEAD<=
<title>1+1=2 | イチ　タス　イチ　ハ　二</title>

<meta content="revealTrans(transition=6, duration=1.0)" http-equiv="Page-Enter">
<meta content="revealTrans(transition=7, duration=1.0)" http-equiv="Page-Exit">

<style type="text/css">
<!--
body {
scrollbar-base-color: #FFFFFF;
scrollbar-track-color: #CDCDCD;
scrollbar-face-color: #CDCDCD;
scrollbar-highlight-color: #CDCDCD;
scrollbar-3dlight-color: #FFFFFF;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-shadow-color: #FFFFFF;
scrollbar-arrow-color: #FFFFFF;
}
-->
</style>

<style type="text/css">
<!--

body {
background:#B7B7B7 url('') repeat-y;!important
background-position: center;!important
position: absolute;!important
margin-top: 625px;!important
margin-left: 0px;!important
overflow-x: hidden;!important
overflow: -moz-scrollbars-vertical;!important
color: #000000;
}

table {
width: 445px;!important
left: 50%;!important
margin-left: 22px;!important
margin-top: 625px;!important
z-index: 80;
}
table table {
width: 100%;!important
margin:0;
}
table table table {
width: auto;
}
html>body table{
position: relative;
}
img.header {
position: absolute;!important
top: 50px;!important
z-index: -10;
}

html>body img.header  {
z-index: 1;
}
html>body div{
z-index: 2;
}
.shadowed img {
display:none;
}
.shadowed img.x{
z-index: 1!important;
z-index: -10;
}
table, .shadowed div{
z-index: 80;
}
html>body table{
position: relative;
}
table, .shadowed div{
z-index: 80;
}
.shadowed span#navigation img {
display: inline;
visibility: visible;
position: relative;
}
p .index {
color: #000000;
}

p table table td.caption {
font-size:12px;
font-weight: bold;
text-transform: uppercase;
letter-spacing: 0px;
color: #000000;
font-family: Trebuchet MS, sans-serif;
background-color: #FFFFFF;
padding-top:1px;
padding-right: 0px;
padding-bottom: 1px;
text-align: left;
border:0px dotted #DADADA;
width:342px;
}
.comments {
font-size: 10px;
font-family: Trebuchet MS, sans-serif;
color: #B3B3B3;

}
a:link, a:visited, a:active {
text-decoration: none;
font-weight: none;
color: #737373;
}
a:hover{
cursor: crosshair;
text-decoration: bold;
background-color: #B0BDBE;
text-transform:uppercase;
color: #FFFFFF;
}
.entrybox td{
text-align: justify;
font-family: Trebuchet MS, sans-serif;
font-size: 10px;
font-color: #595959;
}
.entrybox td.index {
text-align: left;
font-size:10px;
text-weight: bold;
background-color: #;
color: #B3B3B3;
padding-top: 1px;
padding-right: 0px;
padding-bottom: 1px;

}
.head {
background-position: 0% 0%; !important
font-weight: bold;
text-transform:uppercase;
COLOR: #B3D7E6;
font-family: gerogia;
letter-spacing: 2px;
text-align: right;
border:1px dotted #A4A9C0;
}
.entrybox td.index, .index3{
display: none;
}
#sidebar{
position:absolute;
top:450px;
left: 50%; !important
margin-left:-295px !important;
margin-left:-295px;
width: 600px;
height: 20px;
visibility: visible;
z-index:2;
font-size:16px;
font-family: Myriad, sans-serif;
letter-spacing: 8px;
text-align:center;
}
#sidebar img{
display:inline;
}
#x{
position:absolute;
visibility: visible;
top:0px!important;
width: 449px!important
left:50% !important;
margin-left:-224px !important;
margin-left:-224px;
height: 625px!important;
}
#x img{
display:inline;
}
<!--
body, td, font, p {
font-family: Trebuchet MS, sans-serif;
color: #000000;
font-size: 11px;
}
div {
font-family: Trebuchet MS, sans-serif;
color: #B3D7E6;
font-size: 11px;
}
h4{
   font-size:small;
   border-bottom:1px dotted #B4B4B4;
}
hr{
    width: 50%;
    border: 1px dotted #B4B4B4;
    text-align: center;
}
-->
</style>
<=GLOBAL_HEAD

LASTN_WEBSITE<=

<div id="#x"><img src="http://invoke.slipping-halo.net/MISC/zwei112.jpg" style="display:inline;visibility: visible; position:absolute; border:0 none;"
usemap="#imgmap" width="449" height="625" class="header">
<MAP NAME="imgmap">
<AREA SHAPE="rect" ALT="journal" COORDS="294,594,343,608" HREF="http://diav.livejournal.com">
<AREA SHAPE="rect" ALT="archive" COORDS="213,594,262,608" HREF="http://diav.livejournal.com/calendar">
<AREA SHAPE="rect" ALT="friends" COORDS="132,594,181,608" HREF="http://diav.livejournal.com/friends">
<AREA SHAPE="rect" ALT="info" COORDS="60,594,109,609" HREF="http://diav.livejournal.com/info">
</MAP>

</div>
<div> </div>

<style type="text/css">
<!--
table table table table .meta

{visibility:hidden;position:absolute;top:1px}
table table table table table .meta

{visibility:visible;position:relative;top:1px}

tr.caption{
display:none
}
.shadowed td div{
visibility: hidden;
position: absolute;
top: 1px
}
.shadowed img.x{
z-index: 1!important;
z-index: -10;
}
table, .shadowed div{
z-index: 80;
}
html>body table{
position: relative;
}
-->

</style>

<=LASTN_WEBSITE

FRIENDS_OPT_ITEMS=>20
LASTN_OPT_ITEMS=>20



LASTN_TALK_LINKS<=
<tr>
<td align="right" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments" style="text-align: right">
%%readlink%%<a href="%%urlpost%%">love?</a> <br /><br />
</td>
</tr>
<=LASTN_TALK_LINKS

DAY_TALK_LINKS<=
<tr>
<td align="right" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments" style="text-align: right">
%%readlink%%<a href="%%urlpost%%">love?</a> <br /><br />
</td>
</tr>
<=DAY_TALK_LINKS

FRIENDS_TALK_LINKS<=
<tr>
<td align="right" colspan="2" width="100%" bgcolor="%%color:weak_back%%" class="comments" style="text-align: right">
%%readlink%%<a href="%%urlpost%%">love?</a> <br /><br />
</td>
</tr>
<=FRIENDS_TALK_LINKS

LASTN_DATE_FORMAT<=
</td></tr><tr><td class="index2">
<p align="left"><b>^{%%daylong%%, %%monlong%% %%dth%% %%yyyy%% ♥ %%24h%%:%%min%%%%ampm%%}</b></p>
</td></tr><tr><td class="index3">
<=LASTN_DATE_FORMAT


FRIENDS_DATE_FORMAT<=
</td></tr><tr><td class="index2">
<p align="left"><b>^{^{%%daylong%%, %%monlong%% %%dth%% %%yyyy%% ♥ %%24h%%:%%min%%%%ampm%%}}</b></p>
</td></tr><tr><td class="index3">
<=FRIENDS_DATE_FORMAT

DAY_TALK_READLINK=><a href="%%urlread%%"><b>%%messagecount%% ♥%%mc-plural-s%%</b></a> <b>-</b>

LASTN_TALK_READLINK=><a href="%%urlread%%"><b>%%messagecount%% ♥%%mc-plural-s%%</b></a> <b>-</b>

FRIENDS_TALK_READLINK=><a href="%%urlread%%"><b>%%messagecount%% ♥%%mc-plural-s%%</b></a> <b>-</b>

[Mulder]

CODE

top:0px!important;

that's whats causing your header to not move down 625px. change it to

CODE

top: 625px;

oh, delete the margin-top line.


and as for centering the header, its just trial and error.