При наведение на выпадающее меню оно пропадает,как это пофиксить?

Question

[fax1k3]

При наведении на меню, оно пропадает

<ul class="menu">
			<li>
			  <a href="#">Explore</a>
			  <ul>
				<li><a href="#">Limited</a></li>
				<li>
				  <a href="#">Collections</a>
				  <ul>
					<li><a href="#">subitem-7</a></li>
					<li><a href="#">subitem-8</a></li>
					<li><a href="#">subitem-9</a></li>
				  </ul>
				</li>
				<li><a href="#">Collaboration</a></li>
			  </ul>
			</li>

.menu{
	display: flex;
  }
  
  .menu li{
	width: 200px;
	list-style: none;
	background: #ffffff00;
	position: relative;
	left:166px;
	width: 126px;
	height: 43px;
	top: 8px;
  }
  
  .menu a {
	color: #000000;
	text-decoration: none;
	display: block;
	text-align: center;
	height: 40px;
	line-height: 40px;
	transition: all .5s;
  }
  
  .menu a:hover {
	background: #808291;
  }
  
  .menu ul {
	position: relative;
	left:-166px;
	width: 126px;
	height: 43px;
	top: 8px;
	display: none;
	padding: 0;
  }
  
  .menu li:hover > ul {
	display: block;
  }
  
  .menu ul ul {
	display: none;
	top: 0;
	left: 100%;
  }

Answer 1

[rootnoroot]

а position:absolute кто будет писать?

Comments

[fax1k3]

спасибо!