Alright, to start off I'm making a website for a band. They're all great friends of mine and have seen the work I've done for my band (
Link) So this morning I have a few minutes to start things off. It's been a while since I've done any website work so I'm a bit rusty, but I made sure everything is validated.
Link
Go there and look at the site in IE first. Looks good right? Everything is how I wanted it to be (aside from the sloppy programming and un-needed lines that I've got to clean up). Now look at it in FireFox/Mozilla. See the difference? What could be causing this?
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>One Fight Later</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<h1 class="logo">ONE FIGHT LATER</h1>
<div id="navbar">
<ul class="nav">
<li><a href="index.html">HOME</a></li>
<li><a href="index.html">BIOS</a></li>
<li><a href="index.html">LINKS</a></li>
<li><a href="index.html">MEDIA</a></li>
<li><a href="index.html">SHOWS</a></li>
</ul>
</div>
</body>
</html>
style.css
body
{
background-color: #111;
}
h1.logo
{
color: #FFF;
text-align: center;
}
li a
{
display: block;
width: 2em;
font-size: .8em;
padding: .2em;
color: #CCC;
text-decoration: none;
}
li a:hover
{
background-color: #222;
color: #FFF;
text-decoration: none;
}
ul.nav
{
list-style: none;
margin: .2em;
}
#navbar
{
position: absolute;
top: 10px;
left: 2px;
border-color: #333;
border-style: solid;
border-width: 1px;
color: #CCC;
}
(EDIT: fixed your link, which wasn't terminated with a quote... good work, web master :P -- Kylotan)
[Edited by - Kylotan on June 19, 2005 7:56:40 PM]