hey iedereen,
Zit met het volgende probleem:
Ik heb mijn menubalk waar mijn links op staan.
Nu als je over een link gaat wordt deze vet, maar de achtergrond zou ook moeten veranderen dan. Hij geeft de achtergrond wel aan maar niet op de juiste positie.
De achtergrond bij de a:hover zou meer naar boven moeten gaan zodat hij overeenkomt met de menubalk.
Voorbeeld van de error kun je hier bekijken:
http://www.3-design.be/test/
Zit met het volgende probleem:
Ik heb mijn menubalk waar mijn links op staan.
Nu als je over een link gaat wordt deze vet, maar de achtergrond zou ook moeten veranderen dan. Hij geeft de achtergrond wel aan maar niet op de juiste positie.
De achtergrond bij de a:hover zou meer naar boven moeten gaan zodat hij overeenkomt met de menubalk.
Voorbeeld van de error kun je hier bekijken:
http://www.3-design.be/test/
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>::||:: Hacktools ::||::</title>
<link rel="stylesheet" href="opmaak.css" type="text/css" />
</head>
<body>
<div><img src="images/header.jpg" width="1000" height="189" alt="header" /></div>
<div id="menubalk">
<ul id="menu">
<li><a href="#">HOME</a></li>
<li><a href="#">MSN HACKS</a></li>
<li><a href="#">HABBO HACKS</a></li>
<li><a href="#">GAME HACKS</a></li>
<li><a href="#">HACKPACKS</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</div>
</body>
</html>
HTML:
#menubalk{
background:url(images/menubalk.jpg);
background-repeat:no-repeat;
float:left;
position:absolute;
top:189px;
left:0px;
width:999px;
height:48px;
}
#menu{
text-align:center;
padding-left:260px;
font:Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
font-size:10pt;
padding-left:260px;
margin:5px;
}
#menu li{
padding:0px;
margin:5px;
list-style-type: none;
float:left;
width:100px;
height:30px;
}
#menu li a{
color:#FFFFFF;
display:block;
width:100%;
height:100%;
text-decoration:none;
}
#menu li a:hover{
background:url(images/hoover.jpg);
display:block;
width:100%;
height:100%;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
}
Laatst bewerkt:
