1
每当我将鼠标悬停在上面时，此处的下拉菜单（kpi）正在消失。下拉菜单快速消失
我已经看到并尝试了论坛中已经提到的各种解决方案，但似乎没有任何帮助解决它的方法。请帮忙，我想解决这个问题。
感谢您
p, ul, li, div { padding:0; margin:0; }
/*Menu*/
body{
font-family:sans-serif;
}
#menu{
height: 800px !important;
}
#menu{
overflow: auto;
position:relative;
z-index:999;
}
.parent-menu{
background-color: darkgray;
min-width: 100px;
float: left;
}
#menu ul{
list-style-type: none;
}
#menu ul li a {
padding: 30px 30px;
display:block;
color:black;
text-decoration: none;
}
#menu ul li a:hover{
background-color:chocolate;
}
/*SubMenu*/
#menu ul li:hover > ul{
left: 105px;shape-image-threshold:
-webkit-transition: left 100ms ease-in;
-moz-transition: left 100ms ease-in;
-ms-transition: left 100ms ease-in;
transition: left 100ms ease-in;
}
/*bloc confli*/
.nav {
display: none;
}
.container a:hover + nav {
display: block !important;
}
.nav {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
padding: 12px 16px;
z-index: 1;
}
#menu ul li > ul {
position: absolute;
background-color: beige;
top: 0;
left: -250px;
min-width: 200px;
z-index: -1;
height: auto;
-webkit-transition: left 200ms ease-in;
-moz-transition: left 200ms ease-in;
-ms-transition: left 200ms ease-in;
transition: left 200ms ease-in;
}
#menu ul li > ul li a:hover {
background-color:azure;
height: auto;
}<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>PREMIERS PAS AVEC BRACKETS</title>
<meta name="description" content="An interactive getting started guide for Brackets.">
<link rel="stylesheet" href="QuickSP.css">
</head>
<body>
<nav id="menu">
<ul class="parent-menu">
<li><a href="#">Topic1</a>
<ul>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
</ul>
</li>
<li><a href="#">Topic2</a>
<ul class="container">
<li><a href="#">SupTopic1</a>
<nav class="nav">
<ul>
<li>
<a href="#">KPI</a>
</li>
<li>
<a href="#">KPI</a>
</li>
<li>
<a href="#">KPI</a>
</li>
<li>
<a href="#">KPI</a>
</li>
</ul>
</nav>
</li>
<li><a href="#">SupTopic2</a></li>
<li><a href="#">SupTopic3</a></li>
<li><a href="#">SupTopic4</a></li>
</ul>
</li>
<li><a href="#">Topic3</a>
<ul>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
</ul>
</li>
<li><a href="#">Topic4</a>
<ul>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
<li><a href="#">SupTopic</a></li>
</ul>
</li>
</ul>
</nav>
</body>
<html>