Hej!
Edit: Såg nu att det var problem på två sidor, men fixa detta först så får vi se hur mycket problem som återstår på sidan med listan.
Här är kod som fungerar, du var inte långt ifrån!
De ändringar som jag gjorde:
La till en doctype allra högst upp.
La till "type"-attributet på style-taggen.
La till "alt"-attribut på loggan och signaturen.
La till "left: 0" på #footer
Dessa ändringar gjorde dels så att koden validerar och att webbläsarna går in i "standards mode" istället för "quirks mode" vilket gör att de tolkar koden lite annorlunda, samt att det sista tilllägget till #footer gjorde så att footern la sig på rätt plats. Fungerar i FF, IE7 och IE6.
Sen finns det lite annat du skulle kunna förbättra i koden (ex. menucase-divven är onödig och kan tas bort), men det hör inte till den här tråden.
Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>South Vermillion Community Schools</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#header {
position: relative;
background-image: url(images/design_02.gif);
background-repeat: repeat-x;
height: 140px;
}
#news {
text-align:left;
background-color:rgb(238,238,238);
border:1px solid black;
font-size:12px;
width: 80%;
position: relative;
margin: 10 auto;
padding: 10;
}
#stylefour {
position:relative;
display:block;
height:39px;
font-size:11px;
font-weight:bold;
background:transparent url(images/bgOFF.gif) repeat-x top left;
font-family:Arial,Verdana,Helvitica,sans-serif;
border-top:4px solid #B30000;
}
#stylefour ul {
margin:0;
padding:0;
list-style-type:none;
width:auto;
}
#stylefour ul li {
display:block;
float:left;
margin:0;
}
#stylefour ul li a {
display:block;
float:left;
color:#666;
text-decoration:none;
padding:11px 20px 0 20px;
height:23px;
background:transparent url(images/bgDIVIDER.gif) no-repeat top right;
}
#stylefour ul li a:hover,#stylefour ul li a.current {
color:#B30000;
background:#fff url(images/bgON.gif) no-repeat top right;
}
body {
text-align: center;
}
.wrapper {
width: 600px;
text-align: left;
}
img.logo {
float: left;
}
h2 {
padding: 15px 0;
color: rgb(255,204,51);
font: 1.3em verdana,sans-serif;
}
p {
padding: 0 0 15px;
color: #194379;
font: 1em/1.3em arial,sans-serif;
}
strong {
font-weight: normal;
}
a {
color: #194379;
}
a:hover {
text-decoration: none;
}
* {
margin: 0;
}
.wrapper {
margin: 0 auto -4em; /* the bottom margin is the negative value of the footer's height */
position: relative;
}
#signature {
text-align: right;
}
#footer {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 30px;
}
</style>
</head>
<body>
<div id="menucase">
<div id="stylefour">
<ul>
<li><a href="" title="" class="current">Home</a></li>
<li><a href="downloads.html" title="Downloads">Downloads</a></li>
<li><a href="" title="" >Directory of faculty and staff</a></li>
<li><a href="" title="">Employment opportunities</a></li>
<li><a href="http://www.svcs.k12.in.us/SVHarmony.htm" title="Harmony login">Harmony</a></li>
</ul>
</div>
</div>
<div id="header"><img src="images/design_01.gif" class="logo" alt="South Vermillion Community Schools"></div>
<div class="wrapper">
<h2>Vision of excellence</h2>
South Vermillion students possess the skills, abilities, and attitudes to be successful in life, to appreciate their self worth, and to appreciate the value and importance of lifelong learning.
<h2>Mission</h2>
South Vermillion Community Schools provide academic and social experiences that nurture the potential of all students to be productive, creative, and responsible citizens.
<br><br><div id="signature"><img src="images/sig.png" alt="Signature"></div>
<div class="push"></div>
</div>
<div id="footer">
<p>Copyright © 2008 South Vermillion Community Schools, designed by <a href="http://ekdahlproduction.com">Calle Ekdahl</a></p>
</div>
</body>
</html>