HTML Div Overlay Questions

Hi folks

I'm trying to add an interactive header to my music myspace page Glen Kirkham on MySpace Music - Free Streaming MP3s, Pictures & Music Downloads

I created a main picture in PS and sliced all the social networks buttons separately as well as the 'click here for blah blah' in order to use div overlays to line them up to the original picture....

Now as you can see on the header, the top clickable banner, the glenkirkham.com & the youtube buttons are all in place and working fine. When I try to move the facebook, Twitter or Myspace pictures however, they do not move... I have a feeling this is to do with the "div class" names in my html...

Heres what it looks like :

----------------------------------------

<style>
table, tr, td{
background-color:transparent;
}

table table table, table table table td{
background-color:transparent;
}

body, body.bodycontent{
background-color:rgb(0,0,0);
}

table table table table, table table table td{
background-image:none;
background-color:transparent;
}

body, div, p, strong, td, .text, .blacktext10, .blacktext12, a.searchlinkSmall, a.searchlinkSmall:link, a.searchlinkSmall:visited{
color:rgb(13,11,11);
font-weight:normal;
font-style:normal;
text-decoration:none;
text-transform:none;
}

table table table, div table table{
background-color:rgb(236,237,237);
}
a </style> <span style="text-align:center;position:absolute; background-repeat:no-repeat; height:32px; width:100%;left:0px;top:200px; background-image:url(http://www.strikefile.com/ir.gif); background-position:center center;">&nbsp;</span>





























<a href=""> </a><style>body { margin-top: 545px; } .mybannermakerheadbanner { position: absolute; top: -10; width: 800px; text-align:center; margin-top: 0px; margin-left: -400px; left: 50%; }</style><div class="mybannermakerheadbanner"><a href=""><img src="http://i237.photobucket.com/albums/ff240/Glenkirkham/mainpic_01.jpg" alt='Glen Kirkham Myspace' border="0" /></a></div>



<div class="iTopB">


<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmdsZW5raXJraGFtLmNvbQ==" title="" target="_blank"><img src="http://i237.photobucket.com/albums/ff240/Glenkirkham/clickhereforalbum.jpg" width="649" height="37" alt="Facebook" style="border:0" /></a>
</div>
<style>
{! code author:Eileen; xiii | Welcome !}
.i {display:none;}
{! create space for top banner !}
body {margin-top:535px;}
{! position div !}
div.iTopB {position:absolute; top:21px; left:50%; margin-left:-310px;}
</style>




<div class="iTopC">


<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmdsZW5raXJraGFtLmNvbQ==" title="" target="_blank"><img src="http://i237.photobucket.com/albums/ff240/Glenkirkham/Glenkirkhamcom.jpg" width="237" height="64" alt="Glenkirkham.com" style="border:0" /></a>
</div>
<style>
{! code author:Eileen; xiii | Welcome !}
.i {display:none;}
{! create space for top banner !}
body {margin-top:535px;}
{! position div !}
div.iTopC {position:absolute; top:108px; left:50%; margin-left:110px;}
</style>




<div class="iTopD">




<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnlvdXR1YmUuY29tL2dsZW5raXJraGFtbX VzaWM=" title="" target="_blank"><img src="http://i237.photobucket.com/albums/ff240/Glenkirkham/youtube.jpg" width="237" height="61" alt="Youtube" style="border:0" /></a>
</div>
<style>
{! code author:Eileen; xiii | Welcome !}
.i {display:none;}
{! create space for top banner !}
body {margin-top:535px;}
{! position div !}
div.iTopD {position:absolute; top:185px; left:50%; margin-left: 110px;}
</style>







<div class="iTopE">

<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmZhY2Vib29rLmNvbS9wYWdlcy9HbGVuLU tpcmtoYW0vMTYzOTUyMzY2NTg=" title="Facebook" target="_blank"><img src="http://i237.photobucket.com/albums/ff240/Glenkirkham/Facebook.jpg" width="237" height="60" alt="Contact" style="border:0" /></a>
</div>
<style>
{! code author:Eileen; xiii | Welcome !}
.i {display:none;}
{! create space for top banner !}
body {margin-top:535px;}
{! position div !}
div.iTopE {position:absolute; top:120px; left:50%; margin-left: 120px;}
</style>









<div class="iTopF">
<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnR3aXR0ZXIuY29tL2dsZW5raXJraGFt" title="Contact" target="_blank"><img src="http://i237.photobucket.com/albums/ff240/Glenkirkham/Twitter.jpg" width="237" height="40" alt="Twitter" style="border:0" /></a>
</div>
<style>
{! code author:Eileen; xiii | Welcome !}
.i {display:none;}
{! create space for top banner !}
body {margin-top:535px;}
{! position div !}
div.iTopE {position:absolute; top:110px; left:50%; margin-left: 100px;}
</style>









<div class="iTopG">
<a href="http://www.myspace.com/glenkirkham=" title="Myspace" target="_blank"><img src="http://i237.photobucket.com/albums/ff240/Glenkirkham/Myspace.jpg" width="237" height="45" alt="Contact" style="border:0" /></a>
</div>
<style>
{! code author:Eileen; xiii | Welcome !}
.i {display:none;}
{! create space for top banner !}
body {margin-top:535px;}
{! position div !}
div.iTopE {position:absolute; top:450px; left:50%; margin-left: 200px;}
</style>

--------------------------------------





If any of you can help, or guide me in any way to the way in which to align the remaining three objects, Facebook, Twitter, and Myspace... I will buy you a prevebial beer :-)


Many thanks

GK