Rollovers on top of Image Options

[dyindyinjohnson]

I want the rollovers to be on top of the ripped paper header. Is there a way to bring the rollovers to the top?

Here is a picture:

click to enlarge

Code:

CODE

<style>

.image {position:absolute; left:48%; margin-left:-530px;
top:100px;}

.links {position:top;top:900px; left:50%; margin-left:-330px; width:900px;}

.content {position:absolute; top:290px; left:50%; margin-left:-440px;
overflow:auto; width:224px; height:526px; color:000000; font-size:12px;
margin-top:1px;font-weight:normal; letter-spacing:1px; font-family: Palatino Linotype;}

.content2 {position:absolute; top:290px; left:50%; margin-left:200px;
overflow:auto; width:224px; height:526px; color:000000; font-size:12px;
margin-top:1px;font-weight:normal; letter-spacing:1px; font-family: Palatino Linotype;}
</style>


<style type="text/css">
div, table, tr, td, tbody {background-color:transparent;}

a.home{
float:left;
height: 71px;
width: 144px;
overflow: hidden;
background-image: url("http://img248.imageshack.us/img248/5941/homeyz.png");
background-position: center;
background-repeat: no-repeat;
}

a.home:hover{
background-image: url("http://img200.imageshack.us/img200/5434/home2fp.png");
background-position:center;
background-repeat: no-repeat;
}

a.message{
float:left;
height: 50px;
width: 132px;
overflow: hidden;
background-image: url("");
background-position: center;
background-repeat: no-repeat;
}

a.message:hover{
background-image: url("");
background-position:center;
background-repeat: no-repeat;
}

a.comment{
float:left;
height: 50px;
width: 141px;
overflow: hidden;
background-image: url("");
background-position: center;
background-repeat: no-repeat;
}

a.comment:hover{
background-image: url("");
background-position:center;
background-repeat: no-repeat;
}

a.pictures{
float:left;
height:50px;
width:136px;
overflow: hidden;
background-image: url("");
background-position:center;
background-repeat: no-repeat;
}

a.pictures:hover{
background-image: url("");
background-position:center;
background-repeat: no-repeat;
}

a.add{
float:left;
height:50px;
width:77px;
overflow: hidden;
background-image: url("");
background-position:center;
background-repeat: no-repeat;
}

a.add:hover{
background-image: url("");
background-position:center;
background-repeat: no-repeat;
}

a.block{
float:left;
height:50px;
width:92px;
overflow: hidden;
background-image: url(" ");
background-position:center;
background-repeat: no-repeat;
}

a.block:hover{
background-image: url("");
background-position:center;
background-repeat: no-repeat;
}
</style>


<div class="links">
<a href="http://home.myspace.com/index.cfm?fuseaction=user" class="home"></a>
<a href="http://messaging.myspace.com/index.cfm?fuseaction=mail.message=XXXXXXXX" class="message"></a>
<a href="http://comment.myspace.com/index.cfm?fuseaction=user.viewProfile_commentForm&friendID=
XXXXXXXX&MyToken=8b2108be-2301-4485-a399-e782c86fa854" class="comment"></a>
<a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=XXXXXXXX" class="pictures"></a>
<a href="http://friends.myspace.com/index.cfm?fuseaction=invite.addfriend_confirm&statusCD=1&friendId=XXXXXXXX" class="add"></a>
<a href="http://friends.myspace.com/index.cfm?fuseaction=block.blockuser&userID=XXXXXXXX" class="block"></a>
</div>


<div class="image">
<img src="http://img213.imageshack.us/img213/84/owlcitylayout.png" width="1080" border="0" usemap="#imap_1" >
<map id="imap_1" name="imap_1" >
<area shape="rect" coords="25,598,36,751" alt="" title="" href="http://dyindyinjohnsonlayouts.webs.com">
</map>

</div>

<div class="content">
<center>
We wrote a prelude<br>
To our own fairy tale<br>
And bought a parachute<br>
At a church rummage sale<br>
<br><br>
And with a mean sewing machine<br>
And miles of thread<br>
We sewed the day above L.A.<br>
In navy and red<br>
<br><br>
We wound a race track<br>
Through your mom's kitchen chairs<br>
And fought the shadows back<br>
Down your dark basement stairs<br>
<br><br>
I lit a match, then let it catch<br>
To light up the room<br>
And then you yelled as we beheld<br>
An old maroon hot air balloon<br>
<br><br>
I'll be out of my mind<br>
And you'll be out of ideas<br>
Pretty soon<br>
So let's spend<br>
The afternoon in a cold hot air balloon<br>
Leave your jacket behind<br>
Lean out and touch the treetops over town<br>
I can't wait<br>
To kiss the ground<br>
Wherever we touch back down<br>
<br><br>
La la la la la laaa<br>
La la la la la laaa<br>
<br><br>
We drank the Great Lakes<br>
Like cold lemonade<br>
And both got stomach aches<br>
Sprawled out in the shade<br>
<br><br>
So bored to death you held your breath<br>
And I tried not to yawn<br>
You made my frown turn upside down<br>
And now my worries are gone<br>
<br><br>
I'll be out of my mind<br>
And you'll be out of ideas<br>
Pretty soon<br>
So let's spend<br>
The afternoon in a cold hot air balloon<br>
Leave your jacket behind<br>
Lean out and touch the treetops over town<br>
I can't wait<br>
To kiss the ground<br>
Wherever we touch back down<br>
<br><br>
I'll be out of my mind<br>
And you'll be out of ideas<br>
Pretty soon<br>
So let's spend<br>
The afternoon in a cold hot air balloon<br>
Leave your jacket behind<br>
Lean out and touch the treetops over town<br>
I can't wait<br>
To kiss the ground<br>
Wherever we touch back down <br>
</center>

</div>




<div class="content2">

<center>
We wrote a prelude<br>
To our own fairy tale<br>
And bought a parachute<br>
At a church rummage sale<br>
<br><br>
And with a mean sewing machine<br>
And miles of thread<br>
We sewed the day above L.A.<br>
In navy and red<br>
<br><br>
We wound a race track<br>
Through your mom's kitchen chairs<br>
And fought the shadows back<br>
Down your dark basement stairs<br>
<br><br>
I lit a match, then let it catch<br>
To light up the room<br>
And then you yelled as we beheld<br>
An old maroon hot air balloon<br>
<br><br>
I'll be out of my mind<br>
And you'll be out of ideas<br>
Pretty soon<br>
So let's spend<br>
The afternoon in a cold hot air balloon<br>
Leave your jacket behind<br>
Lean out and touch the treetops over town<br>
I can't wait<br>
To kiss the ground<br>
Wherever we touch back down<br>
<br><br>
La la la la la laaa<br>
La la la la la laaa<br>
<br><br>
We drank the Great Lakes<br>
Like cold lemonade<br>
And both got stomach aches<br>
Sprawled out in the shade<br>
<br><br>
So bored to death you held your breath<br>
And I tried not to yawn<br>
You made my frown turn upside down<br>
And now my worries are gone<br>
<br><br>
I'll be out of my mind<br>
And you'll be out of ideas<br>
Pretty soon<br>
So let's spend<br>
The afternoon in a cold hot air balloon<br>
Leave your jacket behind<br>
Lean out and touch the treetops over town<br>
I can't wait<br>
To kiss the ground<br>
Wherever we touch back down<br>
<br><br>
I'll be out of my mind<br>
And you'll be out of ideas<br>
Pretty soon<br>
So let's spend<br>
The afternoon in a cold hot air balloon<br>
Leave your jacket behind<br>
Lean out and touch the treetops over town<br>
I can't wait<br>
To kiss the ground<br>
Wherever we touch back down <br>
</center>

</div>



<style>
{Background Properties}
table, tr, td { background-color: transparent;
border:none; border-width:0;}
body {background-color: transparent}
.mygen { Table Properties }
table table { border: 0px }
table table table table{border:0px}
table table table {
background-color:transparent;}

{Background}
body{
background-color:transparent!important;
background-image:url(http://img248.imageshack.us/img248/7811/backgroundforowlcity.png);
background-position:center !important;
background-repeat:continuous !important;
background-attachment:fixed !important;}

.mygen { Text Properties }
table, div{font-family:Palatino Linotype; color:FFFFFF; font-size:12px;}
</style>
<style>
.profileInfo, .contactTable, .userProfileURL, .interestsAndDetails,
.userProfileDetail, .userProfileNetworking, .userProfileSchool,
.userProfileCompany, .extendedNetwork, .latestBlogEntry,
.blurbs td.text, .orangetext15, table div { display:none!important;
}div table div, table table div {
display:block!important; padding:0;
}table, tr, td {
background:none; border:none;
}.clearfix, .clearfix div {
background-image:none!important;
overflow:hidden;
}.clearfix {
position:relative;
top:-30px;
width:728px;
}.clearfix .clearfix {
bottom:-30px;
margin:-45px 0 0;
position:relative;
top:auto;
width:auto;
}.clearfix .clearfix div {
margin:45px 0 0;
}.clearfix .clearfix div div {
margin:auto;
}.profile, .profile div, .profile input, .clearfix select,.clearfix option, .clearfix ul {
display:none!important;
filter:alpha(opacity=0);
-moz-opacity:0;
opacity:0;
}.friendSpace {display:none;}.friendsComments {display:none;}.contactTable {display: none;}.extendedNetwork {display:none;}.latestBlogEntry {display:none;}.userProfileURL {display:none;}.userProfileDetail {display:none;}
</style>

Thanks!

[Mickey]

Use the z-index property. Read this to understand how.