Hide Drop Down Menu: Where is the error? (pictures)

Report · Dec 20, 2017

Hello everybody,

I am dispairing with my drop down menu in Dreamweaver.

Right now it looks like this:

But the menu won't hide.

My codes are like this:

Where is my mistake?

Thank you so much,

Michaela

Report · Dec 20, 2017

You have got

#menueleiste li a {
display: block;

Change that to

#menueleiste li a {
display: none;

and see what happens.

Incidently, the hover effect will not be able to be used on touch screens, the usage of which is greater than using a mouse.

Wappler, the only real Dreamweaver alternative.

Report · Dec 20, 2017

Not sure what it is you are trying to do but hover is not compatible with mobile devices, you need to trigger the dropdown menu using a click event if you are wanting to target mobile devices.

Below is a hover trigger event that works, based on your coding:

<!DOCTYPE html>

<html>

<head>

<title>CSS Hover Menu</title>

<style>

body {

background-color: #be3e2f;

}

#menueleiste {

background-color: #ababa9;

text-align: center;

width: 50%;

margin: 0 auto;

}

#menueleiste ul {

padding: 0;

margin: 0 auto;

display: inline-block;

}

#menueleiste li {

margin: 0;

padding: 0;

list-style: none;

display: block;

float: left;

position: relative;

}

#menueleiste li a {

display: block;

padding: 15px 25px 10px 25px;

color: #675757;

text-align: center;

}

#menueleiste ul ul {

display: none;

position: absolute;

background-color: #ababa9;

width: 200px;

padding: 5px 0;

}

#menueleiste ul ul li {

width: 200px;

}

#menueleiste ul li:hover > ul {

display: block;

}

#menueleiste ul ul li a {

padding: 0 25px 10px 25px;

text-align: left;

}

</style>

</head>

<body>

<ul>

<li><a href="#">Blendeneinstellungen</a>

<ul>

<li><a href="#">Blende</a></li>

<li><a href="#">Fokus</a></li>

<li><a href="#">Scharfentiefe</a></li>

<li><a href="#">Brenwerte</a></li>

<li><a href="#">Belichtungszeit</a></li>

</ul>

</li>

<li><a href="#">Impressum</a></li>

</ul>

</div>

</body>

</html>

Adobe Community

Hide Drop Down Menu: Where is the error? (pictures)

1 Correct answer