New layout looks awful in other browsers Options

[fr4nk13]

I got this guy to design a layout for my band, and it looks fantastic in Firefox, but the comments and some of the DIV are messing up in other browsers.

http://www.myspace.com/ourproclamation

Here's the codes

Musician's bio

CODE

<div class="topbanner">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/topbanner.png" BORDER="0">

</div>

<div class="mainpic">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/mainpic2.jpg" BORDER="0">

</div>

<div class="contact">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/contact.jpg" BORDER="0">

</div>

<div class="message">

<a href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVz
2FnZSZmcmllbmRJRD0xNDczNzA1OTgmTXlUb2tlbj05OTc3NTk1My1mZjMwLTQ1ZWQtODBhYy05OGM2O
gyZTA3NzY=">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/message.png" BORDER="0">
</a>

</div>

<div class="add">

<a href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJRD0xNDczNzA1OTg="><img src="http://www.belovedgraphics.com/Our%20Proclamation/add.png" BORDER="0">
</a>
</div>

<div class="pics">
<a href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIu
mlld0FsYnVtcyZmcmllbmRJRD0xNDczNzA1OTg=">
<img src="http://www.belovedgraphics.com/Our%20Proclamation/pics.png" BORDER="0">
</a>
</div>

<div class="videos">
<a href="http://vids.myspace.com/index.cfm?fuseaction=vids.showvids&friendID=147370598&n=147370598&MyToken=99775953-ff30-45ed-80ac-98c6982e0776">
<img src="http://www.belovedgraphics.com/Our%20Proclamation/videos.png" BORDER="0">
</a>
</div>

<div class="frankie">

<a href="http://www.myspace.com/frankiemariano">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/frankie2.jpg" border="0">

</a>

</div>

<div class="spacer1">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/spacer.png" border="0">

</div>

<div class="derek">

<a href="http://www.myspace.com/ghettocookiemonster">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/derek.jpg" border="0">

</a>

</div>

<div class="spacer2">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/spacer.png" border="0">

</div>

<div class="sam">

<a href="http://www.myspace.com/thefinalfight356">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/sam.jpg" border="0">

</a>

</div>

<div class="spacer3">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/spacer.png" border="0">

</div>

<div class="ben">

<a href="http://www.myspace.com/hipposandall">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/ben.jpg" border="0">

</a>

</div>

<div class="spacer4">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/spacer.png" border="0">

</div>

<div class="josh">

<a href="http://www.myspace.com/joshrapture">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/josh.jpg" border="0">

</a>

</div>

<div class="Shows">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/shows.jpg" BORDER="0">

</div>

<div class="Blogs">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/blogs.jpg" BORDER="0">

</div>

</div>




<style>

div.topbanner {

position: absolute; top: 0; left: 50%; margin-left: -614px; width: 861px; height: 812;

}

.mainpic {position:absolute;width: 373px; height: 479px; margin-left: -432px; left: 50%; top: 974px; _margin-left:-432;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.contact {position:absolute;width: 373px; height: 479px; margin-left: -404px; left: 50%; top: 1413px; _margin-left:-404;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.message {position:absolute;width: 373px; height: 479px; margin-left: -341px; left: 50%; top: 1420px; _margin-left:-341;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.add {position:absolute;width: 373px; height: 479px; margin-left: -305px; left: 50%; top: 1470px; _margin-left:-305;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.pics {position:absolute;width: 373px; height: 479px; margin-left: -339px; left: 50%; top: 1518px; _margin-left:-339;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.videos {position:absolute;width: 373px; height: 479px; margin-left: -321px; left: 50%; top: 1567px; _margin-left:-321;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.frankie {position:absolute;width: 300px; height: 200px; margin-left: -401px; left: 50%; top: 1613px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.spacer1 {position:absolute;width: 300px; height: 13px; margin-left: -401px; left: 50%; top: 1813px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.derek {position:absolute;width: 300px; height: 200px; margin-left: -401px; left: 50%; top: 1826px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.spacer2 {position:absolute;width: 300px; height: 13px; margin-left: -401px; left: 50%; top: 2026px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.sam {position:absolute;width: 300px; height: 200px; margin-left: -401px; left: 50%; top: 2039px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.spacer3 {position:absolute;width: 300px; height: 13px; margin-left: -401px; left: 50%; top: 2239px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.ben {position:absolute;width: 300px; height: 200px; margin-left: -401px; left: 50%; top: 2252px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.spacer4 {position:absolute;width: 300px; height: 13px; margin-left: -401px; left: 50%; top: 2452px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.josh {position:absolute;width: 300px; height: 200px; margin-left: -401px; left: 50%; top: 2465px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.shows {position:absolute;width: 300px; height: 30px; margin-left: -56px; left: 50%; top: 1319px; _margin-left:-56;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.blogs {position:absolute;width: 300px; height: 30px; margin-left: -56px; left: 50%; top: 1445px; _margin-left:-56;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}


</style>
















































<style>

.mygen { Background Properties }

table, tr, td { background-color:transparent; border:none; border-width:0;}

body {

background-color:black;

background-image:url("http://www.belovedgraphics.com/Our%20Proclamation/bg.jpg");

background-attachment: fixed;

background-position:top center;

background-repeat:no-repeat;

margin-top: 767px;

}

.mygen { Table Properties }

table table { border: 0px }

table table table table{border:0px}

table table table {

border-style:solid;

border-width:2px;

border-color:transparent;

background-color:transparent;

}

.mygen { Text Properties }

.text { color:ffffff; }

table, tr, td, li, p, div { color:ffffff; }

.btext { color:fdfb09; }

.blacktext10 { color:ffffff; }

.blacktext12 { color:ffffff; }

.lightbluetext8 { color:ffffff; }

.orangetext15 {display:none}

.redtext { color:ffffff; }

.redbtext { color:ffffff; }

.whitetext12 {display:none}

a:active, a:visited, a:link { color:135e5c; }

a:hover { color:ffffff; }

a.navbar:active, a.navbar:visited, a.navbar:link { color:ffffff; }

a.navbar:hover { color:ffffff; }

a.redlink:active, a.redlink:visited, a.redlink:link { color:ffffff; }

a.redlink:hover { color:ffffff; }

.nametext {font-size:0pt; color:000000; display:block; background-image:url(""); background-repeat:no-repeat; overflow:none; background-attachment:scroll; text-align:center; width:300px; height:0px;}

html body.bodyContent table tbody tr td table.friendsComments{

width: 800px !important;

margin: 0 !important;

padding: 0 !important;

margin-top: 20px !important;

overflow: hidden !important;

background-color: transparent !important;

margin-left: -1px !important;

_width: 800px !important;

_margin-left: -400px !important;

left:50%;

}

html body.bodyContent table tbody tr td table.friendsComments tbody tr td.text table{

width: 100% !important;

border-collapse: separate !important;

border-spacing: 0px 0px !important;

background-color: transparent !important;

height: auto !important;

}

table.friendsComments tbody tr td.text table tbody tr td{

background-color: transparent !important;

height: auto !important;

}

table.friendsComments tbody tr td.text table tbody tr td span.orangetext15{

background-image: url(http://www.belovedgraphics.com/Our%20Proclamation/comments.jpg);

background-repeat: no-repeat !important;

background-color: transparent;

display: block !important;

height: 70px !important;

color: 000000 !important;

width: 785px;

position: relative;

overflow: hidden;

font-size: 1px;

text-align: right;

margin-top: -1px;

line-height: 300px !important;

_width: 800px !important;

_border-left: 1px 000000 !important;

_border-right: 1px 000000 !important;

_height: 70px !important;

_margin-bottom: -1px !important;

}



</style>


















































<center>

<img src="http://www.belovedgraphics.com/Our%20Proclamation/logo.jpg">

<br>

Our Proclamation is a Christian Post-Hardcore band from Pensacola Florida. They bring a new wave of hardcore/indie elements to a scene where everything sounds the same. They aim to spread the love of Jesus Christ in their music and their everyday lives. Our Proclamation wants to do everything they can in order to make their fans happy.

<br><br>

"Ignorance was bliss when you condemned yourself. Ignored the debts owed to your God. A life without him, welcome to hell. Wonder how long you can keep this facade."

<br><br>

<font size=6><b>GET SOME!</B></font>

<br><br>

<u>MESSAGE FROM THE BAND</u>:

<b>Hey everyone! Just wanted to let you all know that we're the ones that run this myspace, so please, send us a comment so we can get to know you better. We'll do everything we can to get back to you. <br> Oh, and if you want us to play in your city, just "demand us" in your city;)</b>

</center>

<br>

<center>

<img src="http://www.belovedgraphics.com/Our%20Proclamation/Support.jpg">
<center>Put up our banner.<br>
<img src="http://i14.photobucket.com/albums/a341/eiknarfguitarist/newbanner.gif"><br><br>

<textarea name="comments" cols="40" rows="3">
<a href="http://myspace.com/ourproclamation">
<img border="0" src="http://i14.photobucket.com/albums/a341/eiknarfguitarist/newbanner.gif">
</a>


</textarea></center><br>
</center><img src="http://gamersofwar.ga.funpic.de/Line%20of%20Truth/our-proclaimationweb-gif.gif" width="468" border=0>
<center><textarea name="comments" cols="40" rows="3">
<a href="http://myspace.com/ourproclamation"><img src="http://gamersofwar.ga.funpic.de/Line%20of%20Truth/our-proclaimationweb-gif.gif" width="468" border=0></a> </textarea></center>
<br><br>



<center>
<img src="http://i36.tinypic.com/35idcfn.jpg"><br>
<textarea name="comments" cols="40" rows="3">
<object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="all" height="345" width="450" data="http://lads.myspace.com/music/musicplayer.swf?n=aHR0cDovL211c2ljLm15c3BhY2UuY29t&t=/fmOy6ggo7BtqXgiNwvfaCkvVwRG9njMoV6japi2tUzDaayjeYsZx/ghzMnwNU3KVFFgXOQ1s0TE8ED9WgnM7Q==&u=LTE=&a=1&d=MTQ3MzcwNTk4XjEyMjIyODc1MTQ=">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="all" />
<param name="movie" value="http://lads.myspace.com/music/musicplayer.swf?n=aHR0cDovL211c2ljLm15c3BhY2UuY29t&t=/fmOy6ggo7BtqXgiNwvfaCkvVwRG9njMoV6japi2tUzDaayjeYsZx/ghzMnwNU3KVFFgXOQ1s0TE8ED9WgnM7Q==&u=LTE=&a=1&d=MTQ3MzcwNTk4XjEyMjIyODc1MTQ=" />
<param name="quality" value="high" />
<param name="bgcolor" value="FFF" />
<param name="wmode" value="opaque" />
<param name="flashvars" value="culture=en-US" />
</object></textarea>


<br>

<br>

<br>

<br>

<br>

<br>

<br>

Other Members:

CODE

<div class="releases">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/releases.jpg" BORDER="0">

</div>

<div class="releaseinfo">

<table>

<tr>

<td valign="top" align="left" width="100" bgcolor="transparent">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/cd.jpg"></td>

<td style="WORD-WRAP: break-word" width="175" bgcolor="transparent" align="center">

<span class="lightbluetext8">Our Proclamation</span><br>"Choices"

</td></tr>

<tr>

<td valign="top" align="center" width="100" bgcolor="transparent">

<i>iTunes</i><br>

<i><a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmludGVycHVuay5jb20vaXRlbS5jZm0/SXRlbT05ODg1Jg==">Interpunk</a></i>

</td>

</tr>

</table>

</div>













<div class="info">

<img src="http://www.belovedgraphics.com/Our%20Proclamation/info.jpg" BORDER="0">

</div>

<div class="information">

<table>

<tr>

<td valign="top" align="left" width="100" bgcolor="transparent">

<span class="lightbluetext8">Endorsements:</span></td>

<td style="WORD-WRAP: break-word" width="175" bgcolor="transparent" align="right">

<a href="http://www.myspace.com/iloveveilarmsclothing">Veil Arms Clothing</a><br>
<a href="http://www.myspace.com/akenneyphoto">Quantum Bat Photography</a><br>
<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3Lm1heGxpbmVjYXNlcy5jb20v">Maxline Cases</a>

</td>

</tr>

<tr>

<td valign="top" align="left" width="100" bgcolor="transparent">

<span class="lightbluetext8">Hometown:</span></td>

<td style="WORD-WRAP: break-word" width="175" bgcolor="transparent" align="right">

Pensacola, FL

</td>

</tr>

<tr>

<td valign="top" align="left" width="100" bgcolor="transparent">

<span class="lightbluetext8">URL:</span></td>

<td style="WORD-WRAP: break-word" width="175" bgcolor="transparent" align="right">

http://www.myspace.com/ourproclamation

</td>

</tr>

<tr>

<td align="left" bgcolor="0000e0" valign="top" width="100">

<span class="lightbluetext8">Booking:<br></span>_{Local:<br>National:}</td>

<td style="" align="right" bgcolor="0000e0" width="175">

<br>_{Message Us :)<br><b>Shaun with VeiL Arms</b><br>contact@veilarms.com<br>(505)450-4125}

</td>

</tr>

<tr>

<td align="left" bgcolor="0000e0" valign="top" width="100">

<span class="lightbluetext8">Publicity:</span></td>

<td style="" align="right" bgcolor="0000e0" width="175">

<b>Chad Paramore</b><br>_{Infantry Records<br>Chadp@infantryrecords.com}

</td>

</tr>


<tr>

<td align="left" bgcolor="0000e0" valign="top" width="100">

<span class="lightbluetext8">Record Label:</span></td>

<td style="" align="right" bgcolor="0000e0" width="175">

<a href="http://www.myspace.com/infantryrecordstxc"><img src="http://i35.tinypic.com/2h85s3q.jpg" border="0"></a>

</td></tr>

<tr>

<td align="left" bgcolor="0000e0" valign="top" width="100">

<span class="lightbluetext8">Site Design By:</span></td>

<td style="" align="right" bgcolor="0000e0" width="175">

<a href="http://www.myspace.com/belovedgraphicdesign">Beloved Graphics</a>

</td></tr>


<tr>
<div style="text-align:center; padding:10px;"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="280" width="300" data="http://modules.broadtexter.com/mod1/Broadtexter_module.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://modules.broadtexter.com/mod1/Broadtexter_module.swf" />
<param name="flashvars" value="ac=4be977005839346f97cd&chb=0x237B79&chbL=0x3C4C4C&cht=0xFFFFFF&back=0x000000&hd1=f&hd2=c" />
<param name="wmode" value="transparent" />
</object></div></tr>


<tr>
<br/><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="275" width="300" data="http://static.eventful.com/store/stickers/flash/split.swf">
<param name="allowScriptAccess" value="never" />
<param name="allowNetworking" value="internal" />
<param name="movie" value="http://static.eventful.com/store/stickers/flash/split.swf" />
<param name="flashvars" value="&amp;bg=black&amp;sid=P0-001-000174232-4&amp;size=300&amp;fg=FFFFFF&amp;target=myspace" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="salign" value="lt" />
</object><br /><a href="http://www.msplinks.com/MDFodHRwOi8vZXZlbnRmdWwuY29tL3BlcmZvcm1lcnMvUDAtMDAxLTAwMDE3NDIzMi00L2RlbWFuZD9i
z1ibGFjayZhbXA7Zmc9RkZGRkZGJmFtcDt0PW5ldw==" target="_new"><img height="45" width="300" border="0" src="http://static.eventful.com/store/stickers/flash/assets/split/300x45_mid-black.gif" /></a><br /><a href="http://www.msplinks.com/MDFodHRwOi8vZXZlbnRmdWwuY29tL2RlbWFuZC9sZWFybg==" target="_new"><img height="30" width="300" border="0" src="http://static.eventful.com/store/stickers/flash/assets/split/300x30_bottom-black.gif" /></a><br/><br /><font color="999999">View the complete <a href='http://www.msplinks.com/MDFodHRwOi8vZXZlbnRmdWwuY29tL3BlcmZvcm1lcnMvb3VyLXByb2NsYW1hdGlvbi0vUDAtMDAxLTAw
DE3NDIzMi00L2V2ZW50cw=='><font color='999999'>Our Proclamation tour schedule</font></a> </font></tr>


</table>

</div>






<style type="text/css">

.releases {position:absolute;width: 301px; height: 43px; margin-left: -401px; left: 50%; top: 2670px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.releaseinfo {position:absolute;width: 301px; height: 250px; margin-left: -401px; left: 50%; top: 2713px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.info {position:absolute;width: 301px; height: 43px; margin-left: -401px; left: 50%; top: 2922px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

.information {position: absolute; width: 300px; height: 595px; margin-left: -393px; left: 50%; top: 2965px; _margin-left:-393px;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Arial; z-index:8;}



.beloved {position:absolute;width: 301px; height: 43px; margin-left: -401px; left: 50%; top: 3250px; _margin-left:-401;font-size: 10px; line-height: 12px; background-color:transparent; font-family: Georgia; z-index:0;}

</style>

Does anyone know of any way to fix it?

Reason for edit: Edited with codebox tags. - Cristy

[fr4nk13]

Hmm..

Well I tried the first code, and it pushed the comments way over to the right and all the members to the left, in firefox.

And I couldn't see a difference between to the original and new code for the 2nd suggestion.