Siden her. opfylder menuen på 25 px høj og 464 px bred ...med undermenu aktiv....
Slet meget varsomt, det hænger meget sammen.
<!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" xml:lang="da" lang="da">
<head>
<title>Webdesign 101 Demoside</title>
<meta name="robots" content="none" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<style type="text/css" media="screen">
html, body {margin:0;padding:0;}
body { background-color:#889; font-family: georgia,serif;}
div#page {
position:relative;
width:760px;
margin: 0 auto;
background:#efefff;
border-width:0 1px;
border-style: solid;
border-color:#000;
}
div#banner h1 {
height:130px;
color:white;
padding-right:15px;
background-image:url(res/bonneville.jpg);
background-position:left top;
background-repeat:no-repeat;
text-align:right;
margin:0;
}
div#indhold {
width:33em;
margin-bottom: 0;
margin-left: 15px;
border-right:1px solid black;
padding-right:5px;
}
div#indhold h2 {padding-top:1em;}
div#navbar {
width:464px; /* rettet */
background: white;
margin:-1px 0 0 0;
}
div#navbar {
font-size:80%;
font-family:arial,sans-serif;
font-weight:bold;
}
div#navbar ul {
margin:0;
padding:0;
width:100%;
list-style:none;
background: white;
border-top: 1px solid black;
border-bottom: 1px solid black;
}
div#navbar li {
position:relative;
width:91px; /* rettet */
line-height:20px; /* rettet */
margin:0;
padding:0;
list-style:none;
float:left;
border-bottom:none;
border-right:1px solid black;
}
div#navbar li:hover {
background-color: #ccf;
}
div#navbar li.sub {
background-image:url(darrow.png);
background-position:right center;
background-repeat:no-repeat;
}
div#navbar li.sub li.sub:hover {
background-color: #ccf; /* Forhindre background-repeat i IE/Win. */
}
div#navbar ul li a {
display:block;
text-decoration:none;
padding:2px 0 2px 4px; /* rettet*/
width:91px; /*rettet*/
margin:0;
}
div#navbar>ul a {width:auto;}
div#navbar ul ul {display:none;position:absolute;width:92px; /*rettet*/
}
div#navbar ul ul li {border-bottom:1px solid black;border-left:1px solid black;margin-left:-1px;}
div#navbar li.sub li.sub {
background-image:url(darrow.png);
background-position:right center;
background-repeat:no-repeat;
}
div#navbar ul.niveau1 li.sub:hover ul.niveau2 {border-top:1px solid black;}
div#navbar ul.niveau1 li.sub:hover ul.niveau2,
div#navbar ul.niveau2 li.sub:hover ul.niveau3 {display:block;}
div#navbar ul.niveau2 {top:25px; left:0;} /* rettet */
div#navbar ul.niveau3 {top:-1px; left:9em;border-top:1px solid black;}
</style>
<!--[if lt IE 7]>
<style type="text/css" media="screen">
body {behavior:url(csshover.htc);}
</style>
<![endif]-->
</head>
<body>
<div id="page">
<div id="banner">
<h1>Lorem ipsum dolor</h1>
</div>
<div id="navbar">
<ul class="niveau1">
<li class="sub"><a href="[url]">Introduktion</a>
<ul class="niveau2">
<li><a href="[url]">Historie</a></li>
<li><a href="[url]">Matematikken</a></li>
<li><a href="[url]">Fysikken</a></li>
<li><a href="[url]">Rumfart</a></li>
</ul>
</li>
<li class="sub"><a href="[url]">Indre planeter</a>
<ul class="niveau2">
<li><a href="[url]">Merkur</a></li>
<li><a href="[url]">Venus</a></li>
<li><a href="[url]">Jorden</a></li>
<li class="sub"><a href="[url]">Mars</a>
<ul class="niveau3">
<li><a href="[url]">Astronomiske data</a></li>
<li><a href="[url]">Måner</a></li>
<li><a href="[url]">Atmosfære</a></li>
<li><a href="[url]">Topologi</a></li>
</ul>
</li>
</ul></li>
<li><a href="[url]">Kometskyen</a></li>
<li><a href="[url]">Kontakt</a></li>
<li><a href="[url]">slut</a></li>
</ul>
</div>
<div id="indhold">
<h2>Bonneville krater</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam bibendum tempor nulla. Sed commodo. Aliquam feugiat lorem nec sem. Nullam consequat tristique libero. Suspendisse id erat. Duis ante sem, laoreet nec, nonummy non, posuere at, sapien. Nam porta. Cras sapien tortor, vehicula at, scelerisque quis, consequat at, enim. Fusce quis tortor. Quisque magna. Proin nunc. Phasellus purus metus, tempus a, lobortis in, mollis sed, erat. Nulla facilisi. Curabitur wisi.</p>
<p>Maecenas accumsan libero sit amet libero. Sed velit ligula, vulputate sit amet, commodo non, ultrices vel, velit. Donec vitae risus quis erat semper congue. Nunc ornare faucibus enim. </p>
<p>Aenean pretium elit nec velit. Phasellus commodo, nibh at vulputate dapibus, nisl quam venenatis sem, quis ornare nunc nulla ut libero. Aenean ipsum. Fusce lacinia congue mauris. Maecenas non libero. Nullam eget enim. Integer iaculis arcu dictum ligula. Ut neque ipsum, vestibulum ut, interdum at, aliquam vel, felis.</p>
<p>Praesent imperdiet volutpat enim. Donec eget lectus. Morbi ornare dui vel eros. Morbi sit amet magna. Proin a tortor et mi iaculis cursus. Vivamus iaculis felis in justo. Donec dolor dolor, mollis et, sodales eget, vestibulum id, sapien. Proin fringilla risus ut lorem. Phasellus quis leo et sem tincidunt ultricies. Etiam dui lorem, gravida ac, volutpat at, mollis eu, wisi. Nam iaculis cursus arcu. Donec cursus, sem quis pulvinar bibendum, est leo sodales felis, sed laoreet lectus nibh at lacus. Sed erat. Aenean volutpat lacus sit amet pede. Duis nibh dui, tempor in, dictum non, ornare ac, ante. Nulla semper eros in justo. Nulla vel mauris.</p>
<p>Suspendisse mi pede, feugiat non, volutpat ut, placerat vitae, urna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla a tellus. Quisque dolor nisl, placerat a, mollis ac, dignissim at, turpis. Curabitur wisi enim, commodo sit amet, iaculis et, ullamcorper non, quam. Donec arcu arcu, adipiscing a, tincidunt ut, laoreet non, eros. Proin bibendum gravida nisl. Nullam scelerisque consectetuer magna. Nam interdum risus non tortor. Donec eget sapien. In scelerisque, enim vitae porta vehicula, nibh ipsum elementum ipsum, eget hendrerit urna enim eu libero. Donec ornare lacinia diam. Phasellus venenatis lacus ac nulla. Integer euismod. Praesent nec purus. Mauris eget magna.</p>
</div>
</div>
</body>
</html>
