Hover does not work CSS

Question

I want to create a menu with Dropdown in which when I move the mouse in my menu it will appear a sub menu with the links one below the other https://www.w3schools.com/howto/howto_css_dropdown.asp but when hovering over Between/Register it does not show the sub menu.

<div class="col-6 col-md-4">

            <ul class="menu_2">
                <div class="user"><li><i class="fa fa-user"></i> Entre/Cadastre-se<i class="fa fa-angle-down"></i></li></div> 
                <div class="carrinho"> <li><i class="fa fa-shopping-cart"> </i></li></div>

            </ul>

<div class="dropdown">

<div class="dropdown-content">
<a href="#">Meus Pedidos</a>
<a href="#">Meus Dados</a>
<a href="#">Fale Conosco</a>
<div class="linha"></div>
<button  class="dropbtn">Entrar</button>
<a href="cadastro.jsp"> Cliente novo? Cadastre-se</a>
 </div>
 </div>
        </div>

 .dropdown {
position: relative;
display: inline-block;
}

.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}

.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
 }

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
display: block;
 }


 .linha{
border-bottom: 1px solid #E0E0DA;   

 }

Answer 1

If that’s what I understand, put the <button> above <div class="dropdown-content"> and watch the magic happen:

.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}

.dropdown-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
 }

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
display: block;
 }


 .linha{
border-bottom: 1px solid #E0E0DA;   

 }

<div class="dropdown">
 <button class="dropbtn">Entre/Cadastre-se</button>
  <div class="dropdown-content">
    <a href="#">Meus Pedidos</a>
    <a href="#">Meus Dados</a>
    <a href="#">Fale Conosco</a>
    <div class="linha"></div>
   
    <a href="cadastro.jsp"> Cliente novo? Cadastre-se</a>
  </div>
</div>