Quando passo o mouse no botão e vejo o conteúdo não consigo usar a barra de rolagem, simplesmente oculta o conteúdo, alguém pode dar um help?
ul>li {
list-style-type: none;
}
ul li:hover .mostrar {
opacity: 1;
height: 150px;
overflow: auto;
}
.mostrar {
background: #CCC;
height: 15px;
overflow: hidden;
position: relative;
margin-top: 0px;
opacity: 0;
height: 15px;
font-size: 13px;
overflow: hidden;
}
.conteudo-meio {
width: 370px;
position: absolute;
left: 20px;
z-index: 999999;
}
<ul>
<li>
<section class="conteudo-meio">
<a href="#">Passar o mouse no menu</a>
<div class="mostrar">
<p>Item 1</p>
<p>Item 2</p>
<p>Item 3</p>
<p>Item 4</p>
<p>Item 5</p>
<p>Item 6</p>
<p>Item 7</p>
<p>Item 8</p>
</div>
</section>
</li>
</ul>
overflow: hidden;
que está declarada 2x em.mostrar
?