Div overlay layout help., help on div overlay out. Options

[silent-rebirth]

ok i been trying to get this div layout thing. I have got this code out of a hours work.

CODE

<style type="text/css">
table table,table table table table,table table{background-color:transparent;width:;border:0px;}
div,table,tr,td,th{background-color:transparent;text-align:left;border:0px;}
a.navbar,font,.whitetext12,.btext,.orangetext15,
.redbtext,.redtext,.blacktext12,.blacktext10,
.lightbluetext8,strong,.nametext,div b font font,
div font font u,table table table table, table.contacttable{display:none;}
div table form tr td,td.text table,a.text, table div font a,table div div,{visibility:hidden;di-splay:none}
table td table tr td.text table {visibility:hidden;}
table td table tr td.text table table, table td table tr td.text table table td.text {visibility:visible;}
td.text table table {display:inline; visibility:visible;}
embed{position:absolute;top:0px;left:0px;display:block;width:0px; height:0;}
.comments{visibility:visible;width:397px; height:180px;position:absolute;
top:680px;left:415px;
overflow:auto;background-color:transparent;
border:black 0px solid;z-index:2px;}
(the next code)

body {
background-color: 000000;
background-image: url("http://img369.imageshack.us/img369/820/myspacedivloqk7.jpg");
background-position: bottom right;
background-repeat: no-repeat;
background-attachment: fixed;
scrollbar-arrow-color:657383;
scrollbar-track-color: 000000;
scrollbar-shadow-color: 000000;
scrollbar-face-color:000000;
scrollbar-highlight-color:000000;
scrollbar-darkshadow-color:000000;
scrollbar-3dlight-color:000000;}

table, tr, td {background-color: transparent; border: 0px; padding:2;}
table table {border: 0px;}
table table table table{border: 0px;}

{The actual modules}
table table table {border: 1px solid; border-color: FFFFFF; background-color: 000000; }

{sets the default style for the body, table data, list data, divisions and text areas}
body,table, td, li, p, div, textarea
{font:normal 9px arial; color:FFFFFF; font-weight:none; border:0px; text-transform: none; line-height:12px;}

{class for the basic font for the page}
.text {font:normal 9px arial; color:FFFFFF; font-weight:none; border:0px; text-transform: none; line-height:12px;}

{style for the number of comments you have. The actual ..}
.redtext{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }

{style for the number of friends you have.}
.redbtext{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }

{”Blurbs”, “About Me”, “Who I’d like to Meet”, “Friend Space”, and “Friend’s Comments” style}
.orangetext15{font-family: arial; color: FFFFFF; font-weight: bold; font-size: 20px; letter-spacing: -2px;}

{”General”, “Music”, “Movies”, “Television”, “Books”, “Heros”, “Status”, “Here for”, “Hometown”, “Body Type”, “Ethnicity”, “Religion”, “Sign”, “Smoke/Drink”, “Children”, “Education”, “Occupation”, and “Income” title style}
.lightbluetext8{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }

{”Contacting”, “Interests”, “Details”, and “Schools” title styling}
.whitetext12{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{”In your extended network” style}
.blacktext12{font-family: arial; color: FFFFFF; font-weight: bold; font-size: 20px; letter-spacing: -2px; }

{Stylizing of your name above your picture }
.nametext{font-family: arial; color:FFFFFF; font-weight: bold; font-size: 30px; letter-spacing: -3px; line-height: 35px;}

{date stamp on comments}
.blacktext10{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{This is how all anchor points will be displayed; anchor points appear before all links.}
a{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
a:link{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{”View all friends” and “invite more” link style}
a.redlink{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.redlink:link{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.redlink:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercasea.redlink:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
a.redlink:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{2 links in very top on the left, and the 13 links above your picture with make the navigation bar}
a.navbar{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:link{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{Default Links}
a:link, a.man{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; letter-spacing: 0px;}
a:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{bolded words}
.standard b, p b, B, strong {
font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }


</style>
<div class="bg" style="position: absolute; left:0px; top:165px; width:000px; height:000px; overflow: hidden;">
<img src="http://img369.imageshack.us/img369/820/myspacedivloqk7.jpg">
</div>

<div class="content" style="position: absolute; left:000px; top:100px; width:000px; height:000px; overflow: auto;"><center>
CONTENT FOR DIV.
</div>

for some reason that code does not work. It shows my top friends and comments but nothing else.
please help me. I don't no what i did wrong.

[Mickey]

Well first of all, you should separate your HTML codes from your CSS codes so you won't be too confused. It's suggested to place your HTML codes on your About Me section and your CSS codes on your Who I'd Like To Meet section.

Second, the problem with nothing else showing up is because you set the height and width of the DIVs to 000 pixels. What you need to do is play around with those numbers. I've done that for you for the DIV with the image in it. All you need to change is the height and width of the second DIV. It should end up looking like this in your About Me:

CODE

<div class="bg" style="position: absolute; left:0px; top:165px; width:680px; height:936px; overflow: hidden;">
<img src="http://img369.imageshack.us/img369/820/myspacedivloqk7.jpg" />
</div>

<div class="content" style="position: absolute; left:000px; top:100px; width:000px; height:000px; overflow: auto;"><center>
CONTENT FOR DIV.
</div>

Remember to change the text in bold. (You may want to change the margins of the DIVs to change their position, too, so I bolded those as well.) Then, your Who I'd Like To Meet should end up looking like this:

CODE

<style>
table table,table table table table,table table{background-color:transparent;width:;border:0px;}
div,table,tr,td,th{background-color:transparent;text-align:left;border:0px;}
a.navbar,font,.whitetext12,.btext,.orangetext15,
.redbtext,.redtext,.blacktext12,.blacktext10,
.lightbluetext8,strong,.nametext,div b font font,
div font font u,table table table table, table.contacttable{display:none;}
div table form tr td,td.text table,a.text, table div font a,table div div,{visibility:hidden;di-splay:none}
table td table tr td.text table {visibility:hidden;}
table td table tr td.text table table, table td table tr td.text table table td.text {visibility:visible;}
td.text table table {display:inline; visibility:visible;}
embed{position:absolute;top:0px;left:0px;display:block;width:0px; height:0;}
.comments{visibility:visible;width:397px; height:180px;position:absolute;
top:680px;left:415px;
overflow:auto;background-color:transparent;
border:black 0px solid;z-index:2px;}
(the next code)

body {
background-color: 000000;
background-image: url("http://img369.imageshack.us/img369/820/myspacedivloqk7.jpg");
background-position: bottom right;
background-repeat: no-repeat;
background-attachment: fixed;
scrollbar-arrow-color:657383;
scrollbar-track-color: 000000;
scrollbar-shadow-color: 000000;
scrollbar-face-color:000000;
scrollbar-highlight-color:000000;
scrollbar-darkshadow-color:000000;
scrollbar-3dlight-color:000000;}

table, tr, td {background-color: transparent; border: 0px; padding:2;}
table table {border: 0px;}
table table table table{border: 0px;}

{The actual modules}
table table table {border: 1px solid; border-color: FFFFFF; background-color: 000000; }

{sets the default style for the body, table data, list data, divisions and text areas}
body,table, td, li, p, div, textarea
{font:normal 9px arial; color:FFFFFF; font-weight:none; border:0px; text-transform: none; line-height:12px;}

{class for the basic font for the page}
.text {font:normal 9px arial; color:FFFFFF; font-weight:none; border:0px; text-transform: none; line-height:12px;}

{style for the number of comments you have. The actual ..}
.redtext{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }

{style for the number of friends you have.}
.redbtext{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }

{”Blurbs”, “About Me”, “Who I’d like to Meet”, “Friend Space”, and “Friend’s Comments” style}
.orangetext15{font-family: arial; color: FFFFFF; font-weight: bold; font-size: 20px; letter-spacing: -2px;}

{”General”, “Music”, “Movies”, “Television”, “Books”, “Heros”, “Status”, “Here for”, “Hometown”, “Body Type”, “Ethnicity”, “Religion”, “Sign”, “Smoke/Drink”, “Children”, “Education”, “Occupation”, and “Income” title style}
.lightbluetext8{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }

{”Contacting”, “Interests”, “Details”, and “Schools” title styling}
.whitetext12{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{”In your extended network” style}
.blacktext12{font-family: arial; color: FFFFFF; font-weight: bold; font-size: 20px; letter-spacing: -2px; }

{Stylizing of your name above your picture }
.nametext{font-family: arial; color:FFFFFF; font-weight: bold; font-size: 30px; letter-spacing: -3px; line-height: 35px;}

{date stamp on comments}
.blacktext10{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{This is how all anchor points will be displayed; anchor points appear before all links.}
a{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
a:link{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{”View all friends” and “invite more” link style}
a.redlink{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.redlink:link{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.redlink:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercasea.redlink:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
a.redlink:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{2 links in very top on the left, and the 13 links above your picture with make the navigation bar}
a.navbar{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:link{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a.navbar:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{Default Links}
a:link, a.man{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; letter-spacing: 0px;}
a:active{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:visited{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}
a:hover{font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase;}

{bolded words}
.standard b, p b, B, strong {
font-family:arial; font-size:9px; color:FFFFFF; font-weight:none;border:0px; text-transform: uppercase; }
</style>

[silent-rebirth]

Thank you for taking the time to help me.

[karmakiller]

Closed & Moved to Resolved.

[karmakiller]

Topic Closed, and Moved to Myspace Resolved Topics. Please PM a moderator if you would like this reopened.