I really hope someone can help me here. I've explored several avenues and cannot get this to work how I'd like.
I'm trying to customize a myspace for someone (I know.....hardee har) but anyways, I have one main div, then 6 divs contained inside that main div. What I would like to do is have that main div center itself in browsers. If you click
here you will see how the top ad and the search bar both automatically center themselves while my main div stays positioned. If I give it a relative position and try to margin it, it screws up and aligns itself way down on the right side of the page. I've also tried a few other things, nothing seems to be working. I might be missing something stupid, but it may be because I'm about to lose my damn mind.
Here is the code I am using. (obviously I haven't gotten to my links yet)
<xmp>
<style type="text/
css">
body {
background-color: 000000;
}
table {
visibility: hidden;
}
* body form {
visibility: visible;
display: block;
}
body div table, body div table td {
visibility: visible !important;
background-color: 000000 !important;
color: 000000 !important;
}
.btext {display:none;}
.contacttable {display:none;}
.lightbluetext8 {display:none;}
.nametext {display:none;}
.orangetext15 {display:none;}
.redlink {display:none;}
.whitetext12 {display:none;}
.hidethem {visibility:hidden; display:none;}
.comments {visi*bility:hidden;display:none;}
.main {
position: absolute;
top: 160px;
left: 100px;
width: 800px;
height: 1800px;
background-color: FFFFFF;
z-index: 1;
visibility: visible !important;
}
.table1 {
position: absolute;
top: 7px;
left: 9px;
width: 784px;
height: 315px;
background-color: 000000;
background-image: url(
http://img297.imageshack.us/img297/6119/table1fp5.jpg);
background-position: top center;
background-repeat: no-repeat;
z-index: 1;
visibility: visible !important;
}
.table2 {
position: absolute;
top: 330px;
left: 7px;
width: 784px;
height: 315px;
background-color: 000000;
background-image: url(
http://img297.imageshack.us/img297/2824/table2gk2.jpg);
background-position: top center;
background-repeat: no-repeat;
z-index: 1;
visibility: visible !important;
}
.table3 {
position: absolute;
top: 300px;
left: 0px;
width: 784px;
height: 315px;
background-color: 000000;
background-image: url(
http://img297.imageshack.us/img297/3194/table3pa1.jpg);
background-position: top center;
background-repeat: no-repeat;
z-index: 1;
visibility: visible !important;
}
.table4 {
position: absolute;
top: 325px;
left: 9px;
width: 430px;
height: 346px;
background-color: FFFFFF;
visibility: visible !important;
}
.table5 {
position: absolute;
top: 400px;
left: 0px;
width: 430px;
height: 346px;
background-color: FFFFFF;
visibility: visible !important;
}
.table6 {
position: absolute;
top: -400px;
left: 420px;
width: 346px;
height: 762px;
background-color: 000000;
background-image: url(
http://img297.imageshack.us/img297/8351/table6vg5.jpg);
background-position: top center;
background-repeat: no-repeat;
z-index: 1;
visibility: visible !important;
}
.name {
position: relative;
width: 900px;
height: 1193px;
}
.name a {
text-decoration: none;
border: none;
display: block;
position: absolute;
text-indent: -5000px;
}
.sendmessage { width: 150px; height: 35px; z-index: 1; left: 775px; top: 41px }
.addtofriends { width: 150px; height: 35px; z-index: 2; left: 560px; top: 45px }
.instantmessage { width: 150px; height: 35px; z-index: 3; left: 775px; top: 67px }
.addtogroup { width: 150px; height: 35px; z-index: 4; left: 560px; top: 110px }
.forwardus { width: 150px; height: 35px; z-index: 5; left: 740px; top: 150px }
.addtofavorites { width: 150px; height: 35px; z-index: 6; left: 740px; top: 177px }
.blockuser { width: 150px; height: 35px; z-index: 7; left: 560px; top: 205px }
.rankuser { width: 150px; height: 35px; z-index: 8; left: 765px; top: 257px }
.viewfriends { width: 150px; height: 35px;; z-index: 9; left: 560px; top: 265px }
.ticketinfo { width: 450px; height: 50px; ..; left: 765px; top: 285px }
.ticketgiveaway { width: 200px; height: 35px; ..; left: 560px; top: 326px }
.realityshow { width: 200px; height: 35px; ..; left: 735px; top: 367px }
.liveinconcert { width: 200px; height: 35px; ..; left: 794px; top: 510px }
.friends { width: 150px; height: 25px; ..; left: 719px; top: 510px }
.comments { width: 150px; height: 25px; ..; left: 642px; top: 510px }
.pictures { width: 150px; height: 25px; ..; left: 569px; top: 510px }
.videos { width: 150px; height: 25px; ..; left: 794px; top: 440px }
</style>
--------------------------------------------------------------------------------------------------
<div class="main">
<div class="name">
<a href="sendmessage" class="sendmessage" />sendmessage</a>
<a href="addtofriends" class="addtofriends" />addtofriends</a>
<a href="instantmessage" class="instantmessage" />instantmessage</a>
<a href="addtogroup" class="addtogroup" />addtogroup</a>
<a href="forwardus" class="forwardus" />forwardus</a>
<a href="addtofavorites" class="addtofavorites" />addtofavorites</a>
<a href="blockuser" class="blockuser" />blockuser</a>
<a href="rankuser" class="rankuser" />rankuser</a>
<a href="viewfriends" class="viewfriends" />viewfriends</a>
<a href="ticketinfo" class="ticketinfo" />ticketinfo</a>
<a href="ticketgiveaway" class="ticketgiveaway" />ticketgiveaway</a>
<a href="realityshow" class="realityshow" />realityshow</a>
<a href="liveinconcert" class="liveinconcertt" />liveinconcert</a>
<a href="friends" class="friends" />friends</a>
<a href="comments" class="comments" />comments</a>
<a href="pictures" class="pictures" />pictures</a>
<a href="videos" class="videos" />videos</a>
<div class="table1">
<div class="table2">
<div class="table3">
<div class="table4"><embed allowScriptAccess="never" enableJSURL="false" src="
http://lads.myspace.com/videos/vplayer.
swf" flashvars="m=1059290204&type=video" type="application/x-shockwave-flash" width="430" height="346" top="976" left="9"></embed>
<div class="table5">
<embed allowScriptAccess="never" enableJSURL="false" src="
http://lads.myspace.com/videos/vplayer.
swf" flashvars="m=1374175549&type=video" type="application/x-shockwave-flash" width="430" height="346" top="1330" left="9"></embed>
<div class="table6">
</div>
</div>
</td>
</tr>
</table>
</td></tr>
--------------------------------------------------------------------------------------------------
</xmp>
If anyone could help me, it would be greatly appreciated!!!!
Thanks in advance.
-Jenessa