Jump to content

Layout Issues In Firefox


hybrid kill3r

Recommended Posts

I'm having problems with my css/html layout in firefox. it works fine in Internet Explorer, but in firefox, it doesn't. http://www.unholydesigns.com/gameracademy/Here's the HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"><html><head>  <title>Gamer Academy</title>  <meta content="Evrsoft First Page" name="GENERATOR">  <link href="style.css" type="text/css" rel="stylesheet"></head><body>  <div id="container">	<div id="banner"></div>	<div id="horizontal-menu">	  <a href="index.html">Home</a> <a href="#">Forums</a> <a href="#">Help</a>	</div>		<div id='nav-bar'>		 <ul>		 	 <li><a href='index.html'>Home</a></li>			 <li><a href='#'>Forums</a></li>			 <li><a href='#'>Support</a></li>			 <li><a href='#'>Staff</a></li>		</ul>	</div>		<div id='body'>		 <div class='top'><h1>Site News</h1></div>		 		 <h1>Coming Soon!</h1><p>The site is currently undergoing construction.  It should be ready in the next few weeks, but sit tight, the wait will be worth it!  We are also looking for ideas for a new site name, so if you have any, let us know!</p>		 <h2>Posted by Unholy Prayer on 8/11/08.</h2>		 		 <div class='bottom'>		 </div>	</div>		<div id='right-content'>		 <div id='block'>		  </div>		  <div id='block'>		  </div>		  <div id='block'>		  </div>	</div>  </div></body></html>

Here's the css:

body { 	background: url(images/background.jpg) repeat-x;	background-attachment: fixed;	margin: 0 auto;	padding: 10px;	color: #4f7ca6;	font-family: Verdana, Arial, Arial Black;	font-size: 12px;	}#container {	/*margin: 0 auto;*/	}#banner {	background: url(images/banner-mid.png) repeat-x;	height: 124px;	width: 99%;	}#banner #left { 	background: url(images/banner-left.png) no-repeat;	width: 287px;	height: 134px;	float: left;	}#banner h1 {	/*padding: 75px 0px 0px 125px;*/	font-size: 14px;	}#horizontal-menu {	height: 41px;	width: 100%;	margin: 0px;	}#horizontal-menu a {	background: url(images/menu_button_out.png) no-repeat;	height: 34px;	width: 98px;	color: #FFF;	font-size: 13px;	display: block;	float: left;	text-align: center;	text-decoration: none;	vertical-align: middle;	font-weight: bold;	padding: 8px 0px 6px 0px;	}#horizontal-menu a:hover {	background: url(images/menu_button_hover.png) no-repeat;	height: 34px;	width: 98px;	color: #FFF;	font-size: 13px;	display: block;	float: left;	text-align: center;	text-decoration: none;	vertical-align: middle;	font-weight: bold;	padding: 8px 0px 6px 0px;	}#nav-bar {	background: url(images/nav_bar.png) no-repeat;	width: 176px;	height: 634px;	margin: 0px;	float: left;	}#nav-bar ul {	list-style: none;	margin: 20px 20px 0px 0px;	}#nav-bar ul li {	background: url(images/bullet_out.png) no-repeat;	background-position: right;	color: #4f7ca6;	font-size: 11px;	font-family: Verdana, Arial, Arial Black;	padding: 3px 15px 3px 0px;	text-align: right;	}#nav-bar ul li a {	color: #4f7ca6;	font-size: 11px;	font-family: Verdana, Arial, Arial Black;	padding: 3px 0px 3px 0px;	text-align: right;	text-decoration: none;	}#nav-bar ul li a:hover {	background-position: right;	color: #4f7ca6;	font-size: 11px;	font-family: Verdana, Arial, Arial Black;	padding: 15px 0px 3px 0px;	text-align: right;	text-decoration: none;	} #body {	background: none;	color: #4f7ca6;	font-size: 11px;	float: left;	width: 449px;	margin: 0px 30px 0px 30px;	padding: 0px;	}#body h1 {	padding: 15px;	font-size: 12px;	font-weight: bold;	}#body h2 {	padding: 15px;	font-size: 11px;	font-weight: bold;	text-align: right;	}#body p {	padding: 20px;	font-size: 11px;	font-weight: normal;	margin: 0px;	}#body .top {	background: url(images/body_top.png);	width: 449px;	height: 74px;	}#body .top h1 {	color: #4f7ca6;	font-size: 13px;	padding: 10px;	}#body .bottom {	background: url(images/body_bottom.png);	width: 449px;	height: 74px;	}#right-content {	float: left;	}#right-content #block {	background: url(images/block.png) no-repeat;	width: 183px;	height: 167px;	padding: 30px;	}

Thanks for any help.

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...