Hey, I am having a problem with my background in Firefox. The page code follows below:
HEADER.HTM:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<LINK REL="SHORTCUT ICON" HREF="style/images/icons/browsericon.ico">
<link href="style/main.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="logo_strip">
<a href>
<img border="0" alt="Kokoskrazy.com" id="logo" src="images/logo.gif" width="266" height="99">
</a>
</div>
<div id="nav_bar">
<a href="/index.php">Home</a> |
<a href="/members.php">Member Area</a> |
<a href="/forums/">Forums</a> |
<a href="/usercp.php">User CP</a>|
<a href="/memberlist.php">Member List</a>
</div>
<div id="contained">
<div id="main_body">
<div id="userbar">
<hr>
<p><b>10/03/2007:</b> Forums have now been completed!<br>
<b>02/03/2007:</b> Even more bugs fixed, sorry for database errors if you
tried viewing website today, we have restored most of the website and will
investigate that problem that we encountered.<br>
<b>01/03/2007:</b> Fixed more bugs around the website. Sorry members who had
already uploaded avatars, will not happen again. Also changed the colour
scheme a bit.<br>
<b>28/02/2007:</b> Some bugs on our recent scripts have been fixed and are
more secure!<br>
<b>22/02/2007:</b> Kokoskrazy has now been released and accepting
registrations!<br>
</p>
<hr>
<p>
</div>
<div id="container">
<noscript>
<strong>You will not be able to use all applications correctly
if you do not have Javascript enabled!</strong></noscript>okfoewkfoekw
</body>
</html>
MAIN.CSS:
/* Body ***************************************************************************/
body {
font-family: 'Century Gothic', Trebuchet MS, Tahoma, Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
background-image:url('../images/background.gif');
margin: 0px;
text-align: center;
}
table, tr, td {
font-size: 10pt;
font-family: 'Century Gothic', Trebuchet MS, Tahoma, Verdana, Arial, Helvetica, sans-serif;
}
/* HR ***************************************************************************/
hr {
height: 1px;
color: #000000;
}
/* Logo Strip ***************************************************************************/
#logo_strip {
text-align: left;
background-color: #FFFFFF; background-image:url('../images/bannerbackground.gif')
}
#logo {
margin: 0px;
}
/* Navbar ***************************************************************************/
#nav_bar {
height: 26px;
color:#FFFFFF;
text-align: left;
font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
padding-top: 4px;
padding-left: 5px;
font-size: 12px;
background-image:url('../images/nav_background.gif');
}
#nav_bar a{
color: 8e8e8e;
}
#nav_bar a:hover{
color: 5e5e5e;
}
/* Main Body Container ***************************************************************************/
#main_body {
margin: auto;
width: 750px;
color: #000000;
text-align: left;
background-color: #ffffff;
border-left-style: solid;
border-left-width: 2;
border-right-style: solid;
border-right-width: 2;
}
/* Userbar ***************************************************************************/
#userbar {
width: 167px;
float: left;
text-align: left;
background-color: #ffffff;
padding-top: 5px;
padding-right: 4px;
padding-bottom: 4px;
padding-left: 4px;
border-right-style:solid;
border-right-width:1;
}
/* Content Container ***************************************************************************/
#container {
margin: auto;
width: 570px;
text-align: left;
padding-bottom: 10px;
padding-left: 4px;
float: right;
}
/* Footer ***************************************************************************/
#footer {
display: block;
float: left;
width: 100%;
text-align: center;
background-color: #F7F3F7;
}
/* Footer Links ***************************************************************************/
#links {
display: block;
float:left;
width: 100%;
text-align: center;
background-color: #F8F8F8;
}
What my problem is, is that in the DIV represented as '#mainbody', I have a white background and borders on it. In Internet Explorer, it displays 100% perfect, but in Firefox I cant get it to display the background or borders for the DIV '#mainbody'.
I would be greatful if someone could help me out.
Thanks