Geowil Newbie Poster

Edit:

Nevermind I found the problem... I used the wrong comment tags (html instead of css...ack x.X). Fixed the tags and it works perfectly now.

_______________

Hey everyone I need some help. I am working on a site for a class project for my web design class and it is going pretty well, but tonight I ran into a huge problem while reorganizing my css files.

The problem is that my navigation buttons are no longer being placed correctly. Before I moved things around there were no issues, but I do not see any problems with any of the css files I am linking to.

Here is what is happening at the moment: Final Fantasy Fansite; Final Fantasy 7

Here is the html for that page:

<!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>Final Fantasy 7</title>
<link rel="stylesheet" type="text/css" href="http://www.lmpgames.com/fffansite/css/ff7/nav.css">
<link rel="stylesheet" type="text/css" href="http://www.lmpgames.com/fffansite/css/ff7/page.css">
<link rel="stylesheet" type="text/css" href="http://www.lmpgames.com/fffansite/css/ff7/images.css">
</head>

<body>
<div class="background"></div>
<h1>
<a href="index.html"><div class="title"></div></a>
</h1>

<div class="navtr">
<a href="bestiary.html"><div class="bestiary"></div></a>
<a href="guides.html"><div class="guides"></div></a>
<a href="locations.html"><div class="locations"></div></a>
<a href="misc.html"><div class="misc"></div></a>
<a href="../index_test.html"><div class="homepage"></div></a>
</div>

<div class="navbr">
<a href="characters.html"><div class="characters"></div></a>
<a href="items.html"><div class="items"></div></a>
<a href="materia.html"><div class="materia"></div></a>
<a href="skills.html"><div class="skills"></div></a>
</div>

<div class="sb">
<table class="table2" border="0" align="center">
<tr>
<td>
<span class="scrollArea">
<h2>
Final Fantasy 7 Updates/News
</h2>

<h4>

Wednesday, June 8, 2011:
<ul>
<li>Today I scrubbed all CSS from html files and external linked them to make html files more streamlined.</li>
<li>Added in Characters page, buttons, menus, and content for Barret Wallace and Cloud Strife.</li>
<li>Fixed several typos in css files resulting in messed up styles and image placement.</li>
<li>Added in rest of item page selection buttons, menus and content to be added later.</li>
<li>I also have begun to link owner names for weaponry to their character profiles.  So far only AM Cannon is linked as a test.</li>
</ul><br />


Tuesday, June 7, 2011:
<ul>
<li>Created css files for materia and items pages.</li>
<li>Created materia page</li>
<li>Added all navigation buttons to main (this page), items, and materia pages.</li>
<li>Added materia menu buttons, menu and information pages to come later this week.</li>
</ul>
</h4><br />

</span>
</td>
</tr>
</table> 
</div>
</body>
</html>

And here are the linked css files:

nav.css:

@charset "utf-8";
/* CSS Document */

.navtr {
	position:absolute;
	top:80px;
	left:48px;
	z-index:2;
}

.navbr {
	position:absolute;
	top:130px;
	left:48px;
	z-index:2;
}
	
.bestiary {
	position:absolute;
	background-image:url(../../ff7/images/bestiary.png);
	width:150px;
	height:42px;
	left:550px;
}

.characters {
	position:absolute;
	background-image:url(../../ff7/images/characters.png);
	width:150px;
	height:42px;
	left:625px;
}

.guides {
	position:absolute;
	background-image:url(../../ff7/images/guides.png);
	width:150px;
	height:42px;
	left:710px;
}

.items {
	position:absolute;
	background-image:url(../../ff7/images/items.png);
	width:150px;
	height:42px;
	left:785px;
}

.locations {
	position:absolute;
	background-image:url(../../ff7/images/locations.png);
	width:150px;
	height:42px;
	left:870px;
}


.materia {
	position:absolute;
	background-image:url(../../ff7/images/materia.png);
	width:150px;
	height:42px;
	left:945px;
}

.misc {
	position:absolute;
	background-image:url(../../ff7/images/misc.png);
	width:150px;
	height:42px;
	left:1030px;
}

.skills {
	position:absolute;
	background-image:url(../../ff7/images/skills.png);
	width:150px;
	height:42px;
	left:1105px;
}

.homepage {
	position:absolute;
	background-image:url(../../ff7/images/homepage.png);
	width:150px;
	height:42px;
	left:1190px;
}

page.css:

@charset "utf-8";
/* CSS Document */

.background {
	position:absolute;
	left:340px;
	top:0px;
	width:1280px;
	height:720px;
	background-image:url(../../ff7/images/bg.png);
	background-repeat:no-repeat;
	z-index:0;
}


.title {
	position:absolute;
	left:666px;
	top:0px;
	width:650px;
	height:90px;
	background-image:url(../../ff7/images/title.png);
	background-repeat:no-repeat;
	z-index:2;
}

.table {
	position:absolute;
	top:200px;
	left:666px;
	height: 450px;
	z-index:2;
}

.table2 {
	position:absolute;
	width:480px;
	height:450px;
}
	
.sb {
	position:absolute;
	top:180px;
	left:675px;
	z-index:2;
}

.scrollArea {
width: 615px;
height: 450px;
padding-left: 5px;
padding-right: 5px;
border-width: 1px;
border-style: solid;
border-color:#000;
color:#000;
float: left;
overflow: auto;
}

images.css:

@charset "utf-8";
/* CSS Document */

<!-- main images -->	
.bestiary {
	position:absolute;
	background-image:url(../../ff7/images/bestiary.png);
	width:150px;
	height:42px;
	left:550px;
}

.characters {
	position:absolute;
	background-image:url(../../ff7/images/characters.png);
	width:150px;
	height:42px;
	left:625px;
}

.guides {
	position:absolute;
	background-image:url(../../ff7/images/guides.png);
	width:150px;
	height:42px;
	left:710px;
}

.items {
	position:absolute;
	background-image:url(../../ff7/images/items.png);
	width:150px;
	height:42px;
	left:785px;
}

.locations {
	position:absolute;
	background-image:url(../../ff7/images/locations.png);
	width:150px;
	height:42px;
	left:870px;
}


.materia {
	position:absolute;
	background-image:url(../../ff7/images/materia.png);
	width:150px;
	height:42px;
	left:945px;
}

.misc {
	position:absolute;
	background-image:url(../../ff7/images/misc.png);
	width:150px;
	height:42px;
	left:1030px;
}

.skills {
	position:absolute;
	background-image:url(../../ff7/images/skills.png);
	width:150px;
	height:42px;
	left:1105px;
}

.homepage {
	position:absolute;
	background-image:url(../../ff7/images/homepage.png);
	width:150px;
	height:42px;
	left:1190px;
}

.background {
	position:absolute;
	left:340px;
	top:0px;
	width:1280px;
	height:720px;
	background-image:url(../../ff7/images/bg.png);
	background-repeat:no-repeat;
	z-index:0;
}


.title {
	position:absolute;
	left:666px;
	top:0px;
	width:650px;
	height:90px;
	background-image:url(../../ff7/images/title.png);
	background-repeat:no-repeat;
	z-index:2;
}


<!-- item images -->
.acc {
	position:relative;
	width:150px;
	height:42px;
	background-image:url(../../ff7/images/acc.png);
}

.armor {
	position:relative;
	width:150px;
	height:42px;
	background-image:url(../../ff7/images/armor.png);
}

.kitems {
	position:relative;
	width:150px;
	height:42px;
	background-image:url(../../ff7/images/kitems.png);
}

.usables {
	position:relative;
	width:150px;
	height:42px;
	background-image:url(../../ff7/images/usables.png);
}

.weapons {
	position:relative;
	width:150px;
	height:42px;
	background-image:url(../../ff7/images/weapons.png);
}


<!-- materia images -->
.command {
	width:120px;
	height:120px;
	background-image:url(../../ff7/images/materia/cmateria.png);
}

.independant {
	width:120px;
	height:120px;
	background-image:url(../../ff7/images/materia/imateria.png);
}

.magic {
	width:120px;
	height:120px;
	background-image:url(../../ff7/images/materia/mmateria.png);
}

.summon {
	width:120px;
	height:120px;
	background-image:url(../../ff7/images/materia/smateria.png);
}

.support {
	width:120px;
	height:120px;
	background-image:url(../../ff7/images/materia/sumateria.png);
}


<!-- character images -->
.good {
	position:relative;
	width:150px;
	height:42px;
	top:60px;
	background-image:url(../../ff7/images/gguys.png);
}

.bad {
	position:relative;
	width:150px;
	height:42px;
	top:120px;
	background-image:url(../../ff7/images/bguys.png);
}

Anyone had any ideas?