Unable to display div overlays over background image Options

[jandrews404]

Hi, I was wondering if someone could point me in the right direction on a myspace layout issue I'm having. I've successfully hidden all aspects of the page and applied a background image which shows up perfect. However, I unable to make any divs show up. I'm not sure if they're displayed under the background image but I've tried adjusting the Z-index as noted earlier in this thread, but still no dice. Here is a link to the page...

http://www.myspace.com/madtuna187

The code I used to hide the profile and apply the background image was borrowed from several different sources, this site/thread being one of them. I'm beginning to think my problem is related to how the background image is applied (using "body" instead of a div). I'm a newbie to myspace/html/css, so it's highly likely my code syntax may be incorrect. Here's my code.

ABOUT ME:
<style>
table td img {display:none;}
table, td, tr {background-color:transparent !important;}
table.profileInfo {display:none;}
table.contactTable {display:none;}
table.userProfileURL {display:none;}
table.userProfileDetail {display:none;}
table.userProfileCompany {display:none;}
table.userProfileNetworking {display:none;}
table.interestsAndDetails {display:none;}
table.userProfileSchool {display:none;}table.extendedNetwork {display:none;}
table.latestBlogEntry {display:none;}
table.blurbs {display:none;}
table.friendSpace {display:none;}
table.friendsComments {display:none;}
table.navigationBar {display:none;}
form {display:none !important}
table div {display:none;}
div table div {display:block;}
tr td div select{display:none!important;position:relative !important; left:-5000px;}
</style>

<style type="text/css">
body {
background:url('http://i88.photobucket.com/albums/k186/jandrews404/KillingPeopleIsRude.jpg') repeat top center fixed;
}

.div1 {
background-color:444444; border:0px solid; border-color:silver;
width:400px; height:400px; overflow:auto;
position:absolute; z-index:3; left:50%; top:0%;
margin-left:-400px; margin-top:150px;
visibility:visible;}
</style>


LIKE TO MEET:
<div class="div1">
content
</div>

Here is a screenshot of the current layout



and a link to a hi-res copy...
http://i88.photobucket.com/albums/k186/jan...screenshot1.jpg

Any help is greatly appreciated!!

James

[twodreamlovers]

try this.

CODE

<style type="text/css">
body{
background-image:url('http://i88.photobucket.com/albums/k186/jandrews404/KillingPeopleIsRude.jpg');
background-repeat:repeat;
background-position:top center;
background-attachment:fixed;
}
.div1{
background-color:444444;
border:0px;
border-style:solid;
border-color:silver;
width:400px;
height:400px;
overflow:auto;
position:absolute;
z-index:3;
left:50%;
top:0%;
margin-left:-400px;
margin-top:150px;
visibility:visible;
}
</style>

[twodreamlovers]

and if that doesn't work, try taking this part out

CODE

table div {display:none;}
div table div {display:block;}