why is my everything diffrent on my div on IE7, my whole div mess's up on ie7 Options

[Lj-Phresh]

well,
on firefox evrything is right

this the pic

http://i36.tinypic.com/2w4hgqq.gif

but when i change to IE

everything goes up

http://i33.tinypic.com/b50a44.gif

and i googled to see whats wrong and couldnt find the problem

also if i press F11 for both browsers.it goes up

&&

also heres my code

CODE

<style style="text/css">

.37182{hide all the tables}
.profileInfo, .extendedNetwork,
.latestBlogEntry, .interestsAndDetails,
.userProfileURL, .friendsComments,
.userProfileNetworking, .userProfileSchool,
.userProfileDetail, .friendSpace,
.contactTable, .orangetext15{display: none}

.37182{make the tables transparent so you can see good}
table, tr, td{background-color: transparent}

.37182{put the music player in the top-left corner}
embed{position: absolute; top: 0; left: 0; width: 40px;}

.37182{make any other embeds stay where you put them}
td td td td embed,
td td td td object{position: static}


.37182{background settings}
body{
background-color: black;
background-image: url('http://i37.tinypic.com/1538l7a.gif');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center bottom;
}

.37182{the first div}
.keke{position: absolute; left: 50%;
overflow: auto;
top: 270px;
margin-left: -165px;
width: 164px;
height: 121px;
background-color: transparent;
z-index: 1;
padding: 3px;
border: 0px solid;
border-color: 00aaff;
}

.37182{the first div}
.stuff{position: absolute; left: 50%;
overflow: auto;
top: 440px;
margin-left: -255px;
width: 143px;
height: 162px;
background-color: transparent;
z-index: 1;
padding: 3px;
border:0px solid;
border-color: 00aaff;
}

a.text, table div font a, table div div {visibility:hidden;}
table table div font a, table table div div {visibility:visible;}
img {border:0px;}
table tr td div font {display: none;}
tr {background-color:transparent}

.mygen { Created using MyGen 2.5 - www.mygen.co.uk }

.mygen { Text Properties }
table, tr, td, li, p, div { color:FFFFFF; }


</style>



<div class="moveLinks"></div>
<div class="keke">
<div style="text-align: center;">
<center>
<div style="width:###px;height:###px;overflow:auto;border-width:2px;border-color:000000;border-style:solid;">

<b>ABOUT ME</b>


</div>
</div>
</div>

<div class="moveLinks"></div>
<div class="stuff">
<center>
<div style="width:###px;height:###px;overflow:auto;border-width:2px;border-color:000000;border-style:solid;">
links -

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

<b>ANYTHING!!!!!</b>



</div>
</div>

so could yall please help me!


just look at my myspace

http://profile.myspace.com/index.cfm?fusea...endid=277951636

ON IE7 THE TABLES GO UP.WHY????

[pandemonium]

i think it's because you have the image in the background...
what i do is i make a div box with the width and height of the image, position it on the center and then add other transparent boxes above the image with the text