CSS menu - Lave drop down på den ?
HejJeg har fået strikket en menu sammen, men kan ikke finde ud af at få lavet en drop down menu på den.
Er der en der kan fortælle mig hvordan jeg gør dette? Det skal bare være en hvid firkant med eks. 3 links. Der må godt være ramme omkring den musen er over.
Min menu ser sådan ud:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>TEST</title>
<link href="menu_style.css" rel="stylesheet" type="text/css">
</head>
<body>
<br>
<div id="menu">
<ul>
<li><a href="#">LINK 1<br>
<span>underoverskrift 1
</span></a></li>
<li><a href="#">LINK 2<br>
<span>underoverskrift 2
</span></a></li>
<li><a href="#">LINK 3<br>
<span>underoverskrift 3
</span></a></li>
<li><a href="#">LINK 4<br>
<span>underoverskrift 4
</span></a></li>
<li><a href="#">LINK 5<br>
<span>underoverskrift 5
</span></a></li>
<li><a href="#">LINK 6<br>
<span>underoverskrift 6
</span></a></li>
</ul>
</div>
</body></html>
Min css ser sådan ud her:
*{
margin:0;
padding:0;}
#menu{
width:96%;
margin:0px auto;}
#menu li{
display:block;
float:left;}
#menu li a{
background:#ffffff repeat-x;
border:1px solid #ffffff;
margin:0 3px;
padding:5px 12px 12px 12px;
display:block;
float:left;
color:#000000;
text-transform:uppercase;
text-align:left;
text-decoration:none;
font-family:Arial, Verdana, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
height: 25px;}
#menu li a span{
color:#000000;
font-size:10px;
text-transform:lowercase;
text-align:left;
font-family:Arial, Verdana, Helvetica, sans-serif;
font-weight:normal;}
#menu li a:hover{
background:#ffffff repeat-x;
border:1px solid #dddddd;
text-decoration:none;}
#menu li a:hover span{
color:#000000;}.current{
background:#ffffff repeat-x;
border:1px solid #ffffff;
margin:0 3px;
padding:5px 12px 12px 12px;
display:block;
float:left;
color:rgb(51, 102, 255);
text-transform:uppercase;
text-align:center;
text-decoration:none;
font-family:Arial, Verdana, Helvetica, sans-serif;
font-size:14px;
cursor:pointer;
font-weight:bold;
height: 25px;}
.current span{
color:#3C65CF;
font-size:10px;
text-transform:lowercase;
text-align:left;
font-family:Arial, Verdana, Helvetica, sans-serif;
font-weight:normal;}
På forhånd mange tak!
