Validering og IE problem
Jeg kan ikke få min html-kode valideret 100% korrekt. Den melder om tre fejl pga. disse linjer kode:<form id="soege" method="post" action="#">
<input type="text" tabindex="1" class="text"/>
<input type="submit" tabindex="3" value="Søg" class="knap"/>
</form>
Derudover, bliver siden vist fuldstændigt vanvittigt i IE. Det ville normalt ikke være et problem for mig, men da hovedparten af de brugere jeg bygger siden til, bruger IE, er det vigtigt nok.
Min Html-kode ser sådan her ud:
<?xml version="1.0" encoding="ISO-8859-15"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="da">
<head><title>ASPECT4</title>
<link rel='stylesheet' type='text/css' href='./hjemmeside/css/style.css' />
</head>
<body>
<div id="header_wrapper">
<div id="header">
<div class="logo"><a href="/forside/" title="Klik her for at komme til forsiden"><img src="./hjemmeside/images/aspect4_logo.gif" alt="Aspect4.dk" /></a></div>
<div class="navigation">
<ul>
<li><a href="./hjemmeside/filer/produkter.html" title="Produkter">Produkter</a></li>
<li><a href="/Support/" title="Support">Support</a></li>
<li><a href="/Community/" title="Community">Community</a></li>
</ul></div>
</div>
</div>
<div id="content">
<a href="/Forside/" title="Klik her for at komme til forsiden">Forside »</a>
<!--Brødkrummer-->
<div class="ikoner">
<ul>
<li><a href="/Forside/" title="Klik her for at komme til forsiden"><img src="./hjemmeside/images/iconhome.gif" alt="Klik her for at komme til forsiden" /></a></li>
<li><a href="/Mail/" title="Klik her for at skrive en e-mail til os"><img src="./hjemmeside/images/iconmail.gif" alt="Klik her for at skrive en e-mail til os" /></a></li>
<li><a href="/Telefonnummer/" title="Klik her for at få vores telefonnummer"><img src="./hjemmeside/images/iconphone.gif" alt="Klik her for at få vores telefonnummer" /></a></li>
<li><a href="/Print/" title="Klik her for at printe siden"><img src="./hjemmeside/images/iconprint.gif" alt="Klik her for at printe siden" /></a></li>
<li><a href="./hjemmeside/filer/sitemap.html" title="Klik her for at se et sitemap over siden"><img src="./hjemmeside/images/iconsitemap.gif" alt="Klik her for at se et sitemap over siden" /></a></li>
</ul>
</div>
<div id="aktuelt">
<a href="/aktuelt/" title="Klik her for at læse den seneste nyhed"><img src="./hjemmeside/images/aspect4.jpg" alt="Aspect.dk" />
<b>ASPECT4 revolution</b>
<span>ASPECT4 - der er udviklet af EDB Gruppen - er et af Skandinaviens førende virksomhedssystemer. Løsningen tager højde for alle aspekter inden for salg, produktion, distribution og administration. Der er med andre ord tale om et unikt totalkoncept, der øger effektiviteten, konkurrenceevnen og indtjeningen.</span>
<br />
<span class="laesmere">Læs mere »</span>
</a>
</div>
<div id="undermenu">
<dl>
<dt>Quicklinks</dt>
<dd><a href="./hjemmeside/filer/produkter.html" title="Produkter">Produkter</a></dd>
<dd><a href="./hjemmeside/filer/sitemap.html" title="Sitemap">Sitemap</a></dd>
<dd><a href="./hjemmeside/filer/billeder.html" title="Billeder">Billeder</a></dd>
<dd><a href="./hjemmeside/filer/links.html" title="Links">Links</a></dd>
<dd><a href="/eXposer/" title="eXposer">eXposer</a></dd>
<dd><a href="/DocManager/" title="DocManager">DocManager</a></dd>
<dd><a href="/QueryManager/" title="QueryManager">QueryManager</a></dd>
<dd><a href="/BusinessConnector/" title="BusinessConnector">BusinessConnector</a></dd>
<dd><a href="/MobileConnector/" title="MobileConnector">MobileConnector</a></dd>
</dl>
</div>
<form id="soege" method="post" action="#">
<input type="text" tabindex="1" class="text"/>
<input type="submit" tabindex="3" value="Søg" class="knap"/>
</form>
<div class="nyheder">
<ul>
<li class="banner"><a href="http://www.edbgruppen.dk"><img src="./hjemmeside/images/banner.jpg" alt="EDB Gruppen" /></a></li>
<li class="header"><h2>Seneste Nyheder</h2></li>
<li>
<a href="/I erhvervslivets tjeneste/" title="I erhvervslivets tjeneste">
<b>I erhvervslivets tjeneste</b><br />
<span>Det har altid været EDB Gruppens grundfilosofi at betragte informationsteknologien som et professionelt værktøj i erhvervslivets tjeneste. Derfor lytter vi til vores kunder og videreudvikler ASPECT4, så løsningen imødekommer brugernes ændrede behov. </span><br />
</a></li>
<li>
<a href="/Livsnerven i Aspect4/" title="Livsnerven i Aspect4">
<b>Livsnerven i ASPECT4</b><br />
<span>Virksomhedsportalen er livsnerven i ASPECT4. Et enkelt skærmbillede giver brugerne adgang til alle programmer og alle typer information, uanset hvilken kilde den kommer fra.</span><br />
</a></li>
</ul>
</div>
<div class="spotlight">
<ul>
<li>
<a href="/Tilmeld nyhedsbrev/" title="Klik her for at tilmelde dig vores nyhedsbrev"><b>Tilmeld dig vores nyhedsbrev</b><br />
Nu kan du tilmelde dig vores nyhedsbrev. Det er både let og hurtigt - det eneste du skal gøre er at klikke på linket her og udfylde et lille skema.<br />
<small>29. Maj, 2007</small></a></li>
<li>
<a href="/Lean/" title="Lean-Projekt lanceret!"><b>LEAN LANCERET!</b><br />
Lean er et redskab til vækst og øger din virksomheds konkurrenceevne målt på kvalitet, tid og produktivitet. Læs mere om det her! <br />
<small>28. Maj, 2007</small></a></li>
</ul>
</div>
<div id="footer">
<p>2004 - EDB Gruppen | Industrivej Syd 13c | 7400 Herning | tlf: + 45 70 13 22 11 | Fax: + 45 99 28 33 22</p>
</div>
</div>
</body></html>
Min CSS ser sådan her ud:
html,body {
}
body {
background: #fff;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 62.5%;
margin: 0;
padding: 0;
}
a {
text-decoration: none;
border: 0px;
outline: 0px;
color:#0d5a7d;
}
a:hover {
color:#e7301f;
}
img {
border: 0;
}
/* -- Headings -- */
h1 { font-size: 164%; }
h2 { font-size: 145%; }
h3 { font-size: 114%; }
h4 { font-size: 103%; }
h1,h2,h3 { font-family: Verdana, Arial, Helvetica, sans-serif;}
/* 2) Site Structure
---------------------------------------------------------------------------- */
#header_wrapper {
height: 100px;
margin-bottom: 3.2em;
position: absolute;
top: 0;
width: 100%;
}
#header {
width: 900px;
}
#content {
clear: both;
margin: 11.0em auto 0 auto;
margin-bottom: 2em;
width: 900px;
}
/* #) Header
---------------------------------------------------------------------------- */
#header_wrapper {
background: url(../images/header_bg.png) #1b1a1f bottom left repeat-x;
}
#header {
margin: 0 auto;
position: relative;
}
.logo {
float: left;
top: 20px;
position: relative;
margin-left:5px;
}
.navigation {
float: left;
top: 33px;
position: relative;
text-align: right;
width: 900px;
}
.navigation ul {
bottom: -10px;
list-style-type: none;
margin-right: 16px;
padding: 0;
position: absolute;
right: 0;
}
.navigation ul li {
color: #fff;
float: left;
font: normal 28px Verdana, Arial, Helvetica, sans-serif;
letter-spacing: .05em;
}
.navigation ul li a {
color: #fff;
display: block;
margin: 0 0.5em;
padding: 2em 0.5em 0.2em 0.5em;
text-decoration: none;
}
.navigation ul li a:hover {
background: #e7301f;
}
/* #) Homepage
---------------------------------------------------------------------------- */
.ikoner {
float: right;
top: 10px;
position: relative;
width: 300px;
}
.ikoner ul {
bottom: 0px;
list-style-type: none;
margin-right: 0px;
position: absolute;
right: -20px;
}
.ikoner ul li {
float: left;
margin-right: 30px;
}
#aktuelt {
float: left;
height: 202px;
margin-bottom: 3.5em;
margin-top: 5px;
overflow: hidden;
width: 658px;
}
#aktuelt a {
clear: both;
display: block;
height: 202px;
text-decoration: none;
}
#aktuelt a span, #aktuelt span {
color: #404040;
font: normal 14px Verdana, Arial, Helvetica, sans-serif;
letter-spacing: .08em;
line-height: 130%;
}
#aktuelt .laesmere {
color: #e7301f;
}
#aktuelt a:hover {
background: #e4ecf2;
}
#aktuelt img {
clear: left;
float: left;
margin-right: 12px;
}
#aktuelt b {
color: #0d5a7d;
display: block;
font: normal 20px Verdana, Arial, Helvetica, sans-serif;
letter-spacing: .05em;
margin-bottom: .5em;
}
#Aspect4_produkt {
float: left;
height: 202px;
margin-bottom: 3.5em;
margin-top: 5px;
overflow: hidden;
width: 658px;
background: url(../filer/flash/produkt.swf);
}
#sitemap {
float: left;
height: 500px;
margin-bottom: 3.5em;
margin-left: 250px;
margin-top: 5px;
overflow: hidden;
width: 408px;
}
#undermenu {
float: right;
height: 230px;
overflow: hidden;
width: 200px;
margin-top: 5px;
}
#undermenu dl {
margin: 0;
padding: 0;
}
#undermenu dt {
background: #0d5a7d;
color: #fff;
font: normal 18px Verdana, Arial, Helvetica, sans-serif;
padding: 0 0 2px 10px;
}
#undermenu dd {
margin: 0;
padding: 0;
}
#undermenu dd a {
background: #fff;
border-bottom: 1px dotted #404040;
color: #0d5a7d;
display: block;
font-size: 12px;
margin: 0;
padding: .3em 0 .3em 10px;
text-decoration: none;
}
#undermenu dd a:hover {
background: #e4ecf2;
}
.nyheder {
float: left;
position: relative;
width: 658px;
}
.nyheder ul {
float: left;
list-style-type: none;
margin: 0;
padding: 0;
width: 658px;
}
.nyheder li {
display: block;
float: left;
width: 100%;
}
.nyheder li.header {
color: #0d5a7d;
}
.nyheder li.header h2 {
display: inline;
font: normal 20px Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
.nyheder li.header a {
background: none;
display: inline;
float: right;
margin: 0;
padding: 0;
width: auto;
}
.nyheder li a {
color: #404040;
display: block;
float: left;
padding: 12px 0;
text-decoration: none;
width: 100%;
}
.nyheder li a:hover {
background: #e4ecf2;
color: #000;
}
.nyheder li a img {
float: left;
margin-right: 1em;
}
.nyheder li a b {
color: #e7301f;
font: normal 16px Verdana, Arial, Helvetica, sans-serif;
line-height: .8em;
}
.nyheder li a span {
line-height: 125%;
margin-top: .2em;
font: normal 14px Verdana, Arial, Helvetica, sans-serif;
}
.nyheder li.banner a{
background: none;
line-height: 73px;
}
.produkt_tekst {
float: left;
position: relative;
width: 658px;
}
.produkt_tekst ul {
float: left;
list-style-type: none;
margin: 0;
padding: 0;
width: 658px;
}
.produkt_tekst b {
color: #e7301f;
font: normal 16px Verdana, Arial, Helvetica, sans-serif;
line-height: .8em;
}
.produkt_tekst span {
line-height: 125%;
margin-top: .2em;
font: normal 14px Verdana, Arial, Helvetica, sans-serif;
}
.spotlight {
float: right;
width: 200px;
margin-top: 15px;
}
.spotlight ul {
list-style-type: none;
margin: 0;
padding: 0;
width: 200px;
}
.spotlight li {
margin: 0;
padding: 0;
}
.spotlight li a {
color: #696969;
display: block;
font-size: 12px;
padding: 8px 0 10px 1px;
text-decoration: none;
width: auto !important;
width: 200px;
}
.spotlight li a:hover {
background: #e4ecf2;
color: #404040;
}
.spotlight li a b {
color: #e7301f;
font: normal 12px Verdana, Arial, Helvetica, sans-serif;
}
.spotlight li a:hover b {
color: #e7301f;
}
.spotlight li a small {
color: #aaaaaa;
display: block;
margin: 2px 0 0 2px;
padding: 0;
}
.billeder {
float: left;
position: relative;
width: 658px;
}
.billeder b {
color: #e7301f;
font: normal 16px Verdana, Arial, Helvetica, sans-serif;
line-height: .8em;
}
.links {
float: left;
position: relative;
width: 658px;
}
.links ul {
float: left;
list-style-type: none;
margin: 0;
padding: 0;
width: 658px;
}
.links li {
display: block;
float: left;
width: 100%;
}
.links li.header {
color: #0d5a7d;
}
.links li.header h2 {
display: inline;
font: normal 20px Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
}
.links li.header a {
background: none;
display: inline;
float: right;
margin: 0;
padding: 0;
width: auto;
}
.links li a {
color: #404040;
display: block;
float: left;
padding: 12px 0;
text-decoration: none;
width: 100%;
}
.links li a:hover {
background: #e4ecf2;
color: #000;
}
.links li a b {
color: #e7301f;
font: normal 16px Verdana, Arial, Helvetica, sans-serif;
line-height: .8em;
}
.links li a span {
line-height: 125%;
margin-top: .2em;
font: normal 14px Verdana, Arial, Helvetica, sans-serif;
}
form#soege {
float: right;
width: 198px;
margin-top: 19px;
color: #000000;
background-color: #0d5a7d;
border: 1px dotted #000;
font: normal 10px Verdana, Arial, Helvetica, sans-serif;
}
#soege .text {
font: normal 11px Verdana, Arial, Helvetica, sans-serif;
color: #000;
background-color:#fff;
width: 140px;
border: 1px solid #000;
margin-top: 2px;
margin-left: 2px;
margin-bottom: 2px;
}
#soege .text:hover {
background-color:#e4ecf2;
}
#soege .text:focus {
background-color:#e4ecf2;
}
#soege .knap {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
background-color: #fff;
border: 1px solid #000;
color: #0d5a7d;
margin-top: 2px;
margin-left: 2px;
margin-bottom: 2px;
}
#soege .knap:hover {
background-color: #e4ecf2;
}
#footer p{
float: left;
margin-top: 80px;
margin-left: 150px;
color: #aaaaaa;
font: normal 10px Verdana, Arial, Helvetica, sans-serif;
}
