I'm having problems, they are prob really silly but I can't get it right, I am working on a design for a website and I can't get it to look right in all browsers, it looks how it should in Google Chrome and IE but not in Firefox, I can't get the menu/nav bar to sit where it's meant to and it's driving me mad Is there anyone who could help me please? I am getting desperate lol
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="shortcut icon" href="/favicon.ico">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="imagetoolbar" content="no">
<meta http-equiv="cache-control" content="public">
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="expires" content="never">
<meta name="language" content="en-gb">
<meta name="MSSmartTagsPreventParsing" content="true">
<meta name="robots" content="index, follow">
<meta name="revisit-after" content="14 days">
<meta name="keywords" content="Layouts, Designs, Tutorials, Tutorial Sites, Lists, Downloads, Help">
<meta name="description" content="Website layouts, tutorials, listed tut sites and more.">
<meta name="Author" content="Nicky">
<meta name="Publisher" content="Pixel Berry">
<meta name="Copyright" content="Nicky">
<meta name="Content-language" content="en">
<title>• PixelBerry •</title>
<link rel="stylesheet" href="pixelberry1.css" type="text/css">
<script language="JavaScript" type="text/javascript">
//<![CDATA[
<!--
//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com
var message="Right Click is not allowed.";
///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}
function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}
document.oncontextmenu=new Function("alert(message);return false")
// -->
//]]>
</script>
</head>
<body>
<div id="background">
<div id="banner"></div>
<div id="topbg">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="5%">
<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
</td>
</tr>
</table>
<table width="500" cellpadding="10" cellspacing="0">
<tr><td>
<div id="topcontainer"></div>
<div id="container">
<div id="content">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam condimentum tortor et leo sodales vel rutrum libero accumsan.
Donec tincidunt dolor rutrum ipsum tincidunt posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
posuere cubilia Curae; Mauris et dui odio. Nulla vitae massa ligula, et faucibus justo. Pellentesque ac purus magna,
et aliquam dui. Proin sem orci, facilisis quis bibendum non, lobortis at felis. In congue porta pharetra. Sed mi enim,
placerat eget lacinia eu, porttitor id massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur
ridiculus mus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Quisque eget ipsum ut
odio convallis auctor sit amet ut mi. Proin gravida eleifend dolor, vestibulum vehicula ante posuere nec. Integer erat ligula,
imperdiet quis varius sodales, vestibulum id sem. Suspendisse ac mauris eu diam venenatis gravida. Pellentesque non rhoncus
risus. Nulla facilisi. Nullam justo sem, egestas et rutrum nec, euismod ut nunc. Vestibulum sodales aliquet purus.
Nulla ut dui in ante faucibus consequat ultrices eu risus.</p>
</div>
</div>
<div id="footer" >
</div>
</td>
<td class="navcontent">
<div id="nav" class="navcontent">
• Welcome to PixelBerry •
<br /><br /><br />
Website Designs, Tutorials,
<br>Wallpapers & More.
<br /><br /><br /><br />
Get your site listed here & get the <br>
chance to have your tutorials in the Spotlight & under Artist Stalker!
<br /><br /><br />
<img src="./tinc?key=s52P5908" height="13" alt="Visitor Counter" width="47" border="0" align="center">
<br /><br>
</td>
</tr>
</table>
</div>
</body>
</html>
CSS
body {background-color: #202020;background-image: url(./images/bg1.png);
text-align: center;
font-family: verdana;
font-size: 10px;
color: #525252;
margin: auto; }
#background {background-image: url(./images/background.png);
background-repeat: no-repeat; }
#topbg {background-image: url(./images/topbg.png); background-repeat: repeat-x; }
#banner{width: 949px; float: left; height: 138px; background-image: url(./images/logo1.png);
background-repeat: no-repeat; margin: auto;}
#topcontainer {width: 500px; text-align: center; height: 46px; padding: 0px 280px 0px 0px;
background-image: url(./images/indextop.png);
background-repeat: no-repeat; margin: auto; }
#container {margin: auto; text-align: center; width: 500px; padding: 0px 280px 0px 0px;
background-image: url(./images/index.png); background-repeat: repeat-y; }
#content {text-align: center; width: 600px; padding: 3px; margin: auto; }
#footer {background-image: url(./images/indexbtm.png);
background-repeat: no-repeat; margin: auto;
padding: 0px 280px 0px 0px; text-align: center; width: 500px; height: 64px; }
#nav {width: 246px;
height: 328px; background-image: url(./images/nav.png);
background-repeat: no-repeat; padding: 8px 5px 0px 0px; float: right; }
.navcontent { text-align: center; width: 246px; padding: 8px 0px 0px 0px; }
#navcontainer ul{padding: .2em 0;
margin: 0;
list-style-type: none;
background-image: url(./images/topbg.png);
color: #FFF;width: 100%;font: normal 90% arial, helvetica, sans-serif;text-align: center;
border-bottom: 1px solid #000000;}
li { display: inline; }
li a{text-decoration: none;background-image: url(./images/topbg.png);
color: #FFF; padding: .2em 1em;border-right: 1px solid #9c8c9b;}
li a:hover{background-color: #9c8c9b;color: #fff;}
a:link { color: #9c8c9b; text-decoration: none; font-weight: bold;}
a:visited { color: #202020; text-decoration: none; font-weight: bold;}
a:active { color: #9c8c9b; text-decoration: none; font-weight: bold;}
a:hover { color: #202020; text-decoration: underline; font-weight: bold;}
h1 {background-color: #92cece; font-size: 19px; color: #ffffff; font-weight: normal; margin: 0px 0px 10px 0px;
text-transform: uppercase; text-align: left; padding: 5px 5px 5px 10px;
line-height: 25px;}
h2 {font-size: 14px; font-family: arial; color: #2d88a0; margin: 10px 0px 10px 0px; padding: 3px;
border-bottom: 2px solid #4bb7d3;text-transform: uppercase;text-align: center;
letter-spacing: 1px;}
i {font-style: italic; background: #fffdc6; padding: 1px;}
.i {font-style: italic; background: #fffdc6; padding: 1px;}
.table {font-family: verdana; font-size: 11px; width: 420px; text-align: center;
padding: 2px; margin: 10px 15px 10px 15px;}
.thumbnail {height: 165px; background: #cccccc;
padding: 5px;vertical-align:top;}
img {border: 0px; margin: 2px; }
p { margin-bottom: 15px; }
.center { text-align: center; }
.small { font-size: 10px; }
.white { background: #ffffff; }
.form { border: 2px solid #e97947; margin: 3px; background: #ffffff; font-family: arial; font-size: 12px; }
.button { background: #e97947; border: 0px; color: #ffffff; padding: 3px; margin: 3px; font-family: arial;; font-size: 12px; }
I would be hugely grateful for some help x