HTML Help

chrisxuk

chrisxuk

chrisxuk

Soldato
Joined
24 Nov 2008
Posts
3,745
Location
ctf_2Fort
Hi there
As part of my ICT A level course we need to make a fansite. Mines on the Call of Duty series.

Currently i have designed my hompage and set it up in Dreamweaver CS3 however whenever i preview it in firefox the navigation goes all dodgy :p (See picture below)

2zz252g.jpg


Can anybody tell me what i need to do to alter this.

Thanks.
 
It looks to me like the menu is going weird... is that the only problem that is happening? Do you have a code snippet of the menu and CSS that you could show us and perhaps I may be able to see what the problem is and fix it :)
 
Yeah
HTML:
Code: 
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Call of Duty fansite</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style1 {color: #FFFFFF}
-->
</style>
</head>
<body>
<div id="wrapper">
<div id="header"></div>
<div class="style1" id="navigationbar"> 
<div id="navigationbar">
<a class="menu" href="index.html">Home</a>
<a class="menu" href="about.html">About</a>
<a class="menu" href="history.html">History</a>
<a class="menu" href="downloads.html">Downloads</a>
<a class="menu" href="mailto:**********@hotmail.co.uk">Contact</a>
</div> </div>

<div class="style1" id="leftcol">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac purus  a justo imperdiet luctus. Fusce hendrerit, est nec suscipit faucibus,  erat urna sodales turpis, id vulputate nisi nunc at quam. Nam aliquet  sem a purus. Nulla vel nibh ac ligula mollis vehicula. Mauris nisi. In  in nunc. Nam in sapien. In leo. Class aptent taciti sociosqu ad litora  torquent per conubia nostra, per inceptos himenaeos. Ut tristique odio  sed purus. Nulla facilisi. Phasellus varius velit ac turpis semper  iaculis. Vestibulum varius semper nisi. Phasellus gravida tristique  arcu. Nullam odio massa, volutpat ut, venenatis non, laoreet a, augue.  Quisque egestas, odio at tempus luctus, turpis nunc pellentesque massa,  sit amet tristique risus dui condimentum odio. Pellentesque id pede at  tellus lacinia fermentum. Cum sociis natoque penatibus et magnis dis  parturient montes, nascetur ridiculus mus. </div>
<div class="style1" id="rightcol">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ac purus  a justo imperdiet luctus. Fusce hendrerit, est nec suscipit faucibus,  erat urna sodales turpis, id vulputate nisi nunc at quam. Nam aliquet  sem a purus. Nulla vel nibh ac ligula mollis vehicula. Mauris nisi. In  in nunc. Nam in sapien. In leo. Class aptent taciti sociosqu ad litora  torquent per conubia nostra, per inceptos himenaeos. Ut tristique odio  sed purus. Nulla facilisi. Phasellus varius velit ac turpis semper  iaculis. Vestibulum varius semper nisi. Phasellus gravida tristique  arcu. Nullam odio massa, volutpat ut, venenatis non, laoreet a, augue.  Quisque egestas, odio at tempus luctus, turpis nunc pellentesque massa,  sit amet tristique risus dui condimentum odio. Pellentesque id pede at  tellus lacinia fermentum. Cum sociis natoque penatibus et magnis dis  parturient montes, nascetur ridiculus mus. </div>
<div id="footer">
  <div align="center"><span class="style1"> © Call of Duty Fansite 2009</span></div>
</div>
</div>
</body>
</html>

CSS:
Code: 
body {
	background-color: #000000;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	}

#wrapper {
	width: 823px;
	margin: 0 auto;
}
#header {
	float: left;
	height: 200px;
	width: 823px;
	background-image: url(images/header.gif);
	background-repeat: no-repeat;
}
#navigationbar {
	background-image: url(images/navbar.gif);
	background-repeat: no-repeat;
	float: left;
	height: 33px;
	width: 823px;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 17px;
	word-spacing: 70px;	
}
a.menu:link {
	color: #ffffff;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
}
a.menu:visited {
	color: #ffffff;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 17px;
}
a.menu:hover {
	color: #9ba6ab;
	text-decoration: underline;
	font-size: 17px;
}
a.text:link {
	color: #d2d2d2;
	text-decoration: underline;
	font-family: Arial, Helvetica, sans-serif;
}
a.text:visited {
	color: #d2d2d2;
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;
}
a.text:hover {
	color: #9ba6ab;
	text-decoration: none;
}
#main {
	float: left;
	height: auto;
	width: 823px;
}
#leftcol {
	float: left;
	height: auto;
	width: 290px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 30px;
}

#rightcol {
	float: right;
	height: auto;
	width: 413px;
	padding-right: 35px;
	margin-right: 35px;
	margin-right: opx;
}
#footer {
	font-family: Arial, Helvetica, sans-serif;
	font-size: x-small;
	float: left;
	height: 50px;
	width: 823px;
	color: #666666;
	clear: both;
}

Thanks :)

EDIT: You just wanted a snippet, but thats all of it :p
 
Last edited:
for one... you have two navigations

<div class="style1" id="navigationbar">
<div id="navigationbar">


shouldn't it be:

<div class="style1" id="navigationbar">
links
</div>
 
You must log in or register to reply here.
Back
Top Bottom