Making a Guild Layout Firefox friendly

[kirste]

I have just made my frist guild layout, it looks fine in Internet Explorer but it doesn't work on Friefox, is there a code that I can use to make it FireFox friendly?

Thanks for any help you can give me =)

This is the code I am using.

 

<style>
body, td, p, div { font-size: x-small; }
</style>

<style>
body, td, p, div { font-family: times new roman; }
</style>

<img src="//images.weserv.nl/?url=http://i119.photobucket.com/albums/o150/kursttie/EternalBattle2-2.jpg">

<style>
body { background-image: url(http://i119.photobucket.com/albums/o150/kursttie/background.jpg); }
</style>

<div style="overflow:auto;position:relative;width:150px;height:500px;top:-370px;left:710px;">
<p class="header">Links</p>
<a href="~joegum2000"><b>Guild Webbie</b></a><p>

<a href="~BlueMarmalade00"><b>Meet the Members</b></a><p>

<a href="~BabyBBabyB91_2004"><b>Activities</b></a><p>

<a href="~5_x_Pirate_x_5"><b>Role Play Home</b></a><p>

<a href="~isskaah"><b>Dailies</b></a><p>

<a href="~ckorebat"><b>Graphic Page</b></a><p>

<a href="~Emmett_Cullen_1935"><b>Guild Newspaper</b></a><p>

<a href="~crystalizedlife"><b>The Cullen House</b></a><p>

<a href="~Alophina"><b>The Guild Library</b></a>
</div>

<div style="overflow:auto;position:relative;width:200px;height:400px;top:-500px;left:10px;">
<p class="header">Welcome</p>
Welcome to Eternal Battle! This guild is made for people who love the Stephanie Meyer series Twilight and also love the Twilight film. We are an active friendly Role – Play Guild and we strive to be unique and have something for everyone. 
</div>

<div style="overflow:auto;position:relative;width:400px;height:400px;top:-900px; left:250px;">
<p class="header">Cullen Chat</p>

<b><u>kirste51</u></b>: Welcome to the guild. Please have a look around we have much to see and do. If you have just joined please neomail me.
If you are new member please check out the Guild Webbie and all the other links.
Could everyone please check the 'Enable Guild Mailing' Box <a href="/preferences.phtml"><b><u>Here</u></b></a>, as this enables you to receive news and updates about the guild from me by neo mail. 

<p><b><u>Weasel:</u></B> Hey everybody! Like Kirsty said, Welcome to the Guild. I'm weaseldale. I don't have anything new to put here, since all the important stuff has been said. But anyway, if you're new you should probably go visit all of our links. Feel free to ask me any questions about the guild if you want. I don't know as much as Kirsty does though. I hope you all enjoy the guild!</div>
</div>

<div style="overflow:auto;position:relative;width:200px;height:400px;top:-1150px; left:10px;">
<p class="header">Updates</p>

23/12/2008: New Guild Layout<br>
22/12/2008: Role - Play page Updated<br>
05/12/2008: New Guild Activities

<div>
<style />
table, td{background:none;}
.contentHeader, .sidebar, #footer, #header, #footerNifty, table table table #content, .contentModuleHeaderAlt{display:none}
.contentModuleContent{display:none}
#main {background:#;border:0;}
</style />

<style / type="text/css">
body, a:visited, a:link,td, font{color:white;font: 7.5pt georgia;} 
A:HOVER {letter-spacing: 1px; text-decoration: underline;color: white;}
ul{padding-left:0px}

#n{background:none}table{background:none}
.hdr{display: none;}hr{display: none;}
.sf,.smallfont,.tt,.tl{display:none;}
.content {background:none;}
.header{text-align: center; color:#663300; 
font: 11pt verdana; font-weight:bold; background-color:#FFFFCC;

body{scrollbar-arrow-color:#000000; scrollbar-track-color:#fffffe; scrollbar-face-color:#fffffe; scrollbar-highlight-color:#fffffe; scrollbar-3dlight-color:#fffffe; scrollbar-darkshadow-color:#fffffe; scrollbar-shadow-color:#fffffe}
</style />

[ChaoticFission]

my first suggestion to you, although it will not effect the page at all, is to put all of the style definitions together. it will make the page neater and more semantic, since all of the definitions will be in one place--at the top of the page (or the beginning of your code).

 

a link to your guild page would also be a great start so that we can see what you're trying to do.

[Mimii]

To add to the above statement you can validate your coding which makes it standards compliant and therefor will appear the same (for the most part) on all browsers. Input your coding in these and it can help you fix errors, most of the time it will fix your problems.

 

http://jigsaw.w3.org/css-validator/