Ik heb laats geprobeerd met een css code een dropdown menu te maken
vervolgens heb ik hem in mozilla firefox bekeken en het werkte allemaal naar behoren
toen kwam mijn vader de kamer binnen en maakte mij er op attent dat ik de code ook in andere browsers zou moeten testen, hier kwamen dus de problemen. IE laat de butten wel goed zien maar het drop down menu
werkt niet
Hier is de code
[code=html]
<html>
<head>
<style type="text/css">
#contactlink
{
margin: 0px;
padding: 0px;
}
#contactlink ul
{
margin: 0px;
padding: 0px;
line-height: 30px;
}
#contactlink li
{
margin: 0px;
padding: 0px;
list-style: none;
float: left;
position: relative;
background-color: #666666;
border: 1px solid #FFFFFF;
}
#contactlink ul li a
{
text-align: center;
font-family:"Comic Sans MS", cursive;
text-decoration: none;
height: 35px;
width: 107px;
display: block;
color: #FFFFFF;
text-shadow: 1px 1px 1px #000000;
}
#contactlink ul ul
{
position: absolute;
visibility: hidden;
top: 36px;
}
#contactlink ul li:hover ul
{
visibility: visible;
}
#contactlink li:hover
{
background-color: #0072ff;
}
#contactlink ul li:hover ul li a:hover
{
color: #000000;
background-color: #999999;
}
</style>
</head>
<body>
<div id="contactlink">
<ul>
<li><a href="#">Contact</a>
<ul>
<li><a href="#">E-Mail</a></li>
<li><a href="#">Telefoon</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>
[/code=html]
nu is mijn vraag:
is het mogelijk om dit soort menu's te maken in css en ze werkend te krijgen in zowel Mozilla als IE
of is dit bij voorbaat al onmogelijk
vervolgens heb ik hem in mozilla firefox bekeken en het werkte allemaal naar behoren
toen kwam mijn vader de kamer binnen en maakte mij er op attent dat ik de code ook in andere browsers zou moeten testen, hier kwamen dus de problemen. IE laat de butten wel goed zien maar het drop down menu
werkt niet
Hier is de code
[code=html]
<html>
<head>
<style type="text/css">
#contactlink
{
margin: 0px;
padding: 0px;
}
#contactlink ul
{
margin: 0px;
padding: 0px;
line-height: 30px;
}
#contactlink li
{
margin: 0px;
padding: 0px;
list-style: none;
float: left;
position: relative;
background-color: #666666;
border: 1px solid #FFFFFF;
}
#contactlink ul li a
{
text-align: center;
font-family:"Comic Sans MS", cursive;
text-decoration: none;
height: 35px;
width: 107px;
display: block;
color: #FFFFFF;
text-shadow: 1px 1px 1px #000000;
}
#contactlink ul ul
{
position: absolute;
visibility: hidden;
top: 36px;
}
#contactlink ul li:hover ul
{
visibility: visible;
}
#contactlink li:hover
{
background-color: #0072ff;
}
#contactlink ul li:hover ul li a:hover
{
color: #000000;
background-color: #999999;
}
</style>
</head>
<body>
<div id="contactlink">
<ul>
<li><a href="#">Contact</a>
<ul>
<li><a href="#">E-Mail</a></li>
<li><a href="#">Telefoon</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>
[/code=html]
nu is mijn vraag:
is het mogelijk om dit soort menu's te maken in css en ze werkend te krijgen in zowel Mozilla als IE
of is dit bij voorbaat al onmogelijk
:strip_icc():strip_exif()/u/195257/owl_icon.jpg?f=community){kind=icon}
:strip_exif()/u/259931/stuiterbal2.gif?f=community)
:strip_icc():strip_exif()/u/51807/Lucky.jpg?f=community)
:strip_exif()/u/14385/malibu.gif?f=community)
:strip_icc():strip_exif()/u/233736/Tnet.jpg?f=community)
/u/102105/crop56f481fe1f74f.png?f=community)
:strip_icc():strip_exif()/u/109161/crop5a7da4f89d10d_cropped.jpeg?f=community)