HTML:
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css">
<title>Joren's site! Home</title>
</head>
<body>
<div id="container">
<div id="header">
<br><center><img src="logo.png"</img></center>
</div>
<div id="horizontalnav">
<div class="navlinks">
<ul>
<li><a href="index.html">Home</a>
<li><a href="wiebenik.html">Over mij</a>
<ul>
<li><a href="watdoeik.html">Wat doe ik?</a></li>
<li><a href="onderbehoud.html">Onder Behoud</a></li>
</ul>
<li><a href="login.html">Log In</a>
<ul>
<li><a href="gebruikers.html">Gebruikers</li></a>
<li><a href="beheerders.html">Beheerders</li></a>
</ul>
<li><a href="contact.html">Contact</a>
</li>
</ul>
</div>
</div>
<div id="leftnav">
<div class="navlinks2">
</div>
</div>
<div id="body">
<center>
Dit is mijn eerste site, ik probeer zo snel mogelijk alles in orde te krijgen en de site zo goed mogelijk te maken. <br>
Met vriendelijke groeten, <br>
Joren Wouters
</center>
</div>
<div id="footer">This is the footer</div>
</div>
</body>
</html>
#container {
width: 100%;
}
#header {
width: 100%;
height: 100px;
position: relative;
background-color: #96d8ea;
}
#header p{
color: #000000;
font-family: Verdana;
font-size: 25px;
font-weight: bold;
text-decoration: underline;
}
#horizontalnav {
width: 100%;
height: 40px;
position: relative;
background-color: #5acded;
}
.navlinks {
position: absolute; top: 4px; left: 360px;
}
.navlinks {
margin: 0;
padding: 0;
}
.navlinks ul {
margin: 0;
padding: 0;
line-height: 30px;
}
.navlinks li {
margin: 0;
padding: 0;
list-style: none;
float: left;
position: relative;
background: #999;
}
.navlinks ul li a {
text-align: center;
font-family: Verdana;
text-decoration: none;
height: 30px;
width: 150px;
display: block;
color: #000000;
border: 1px solid #000000;
}
.navlinks ul ul {
position: absolute;
visibility: hidden;
top: 32px;
}
.navlinks ul li:hover ul {
background-color: #000000;
color: #ffffff;
visibility: visible;
}
.navlinks li:hover {
background: #09F;
}
.navlinks ul li:hover ul li a:hover {
background: #CCC;
color: #ffffff;
}
#leftnav {
float: left;
width: 140px;
height: 536px;
background-color: #5acded;
}
.navlinks2 ul {
margin: auto;
}
.navlinks2 li {
text-align: center;
margin: 20px 30px 0px 0px;
list-style: none;
}
.navlinks2 li a {
color: #000000;
font-size: 16px;
font-family: Verdana;
text-decoration: none;
}
.navlinks2 li a:hover {
color: #999;
font-size: 16px;
font-family: Verdana;
text-decoration: underline;
}
#body {
width: 100%;
height: 536px;
background-color: #96d8ea;
}
#body p{
color: #000000;
font-family: Verdana;
size: 16px;
}
#footer {
clear: both;
background-color: #999;
}Mijn navigatie menu werkt prima op Firefox.
Maar de list items komen niet tevoorschijn als je met je muis over het menu gaat in Internet Explorer....
Weet iemand hoe je dit kan veranderen?
Met vriendelijke groeten,
Jorenman
Laatst bewerkt door een moderator:
