Estou desenvolvendo uma aplicação web e gostaria que quando eu passar o mousa por cima do marca <p class="ordena" id="marca"><span class="caret"></span> Marca</p>
ele mostrasse o conteudo dentro da div <div class="dropdown-content-Marcas"></div>
mas não estou conseguindo;.
HTML
<div class="conteudo_ordenar">
<h3 class="titulo_ordenar">Ordenar Pesquisa</h3>
<p class="ordena" id="marca"><span class="caret"></span> Marca</p>
<p class="ordena"><span class="caret"></span> Tamanho</p>
<p class="ordena"><span class="caret"></span> Cor</p>
<p class="ordena"><span class="caret"></span> Faixa De Preço</p>
</div>
<div class="dropdown-content-Marcas">
<li><a href="#"><input id="checkBox" type="checkbox"> Adidas</a></li>
<li><a href="#"><input id="checkBox" type="checkbox"> Nike</a></li>
<li><a href="#"><input id="checkBox" type="checkbox"> Lacoste</a></li>
</div>
</div>
CSS
.dropdown-content-Marcas{
display: none;
}
#marca:hover .dropdown-content-Marcas{
display: block;
}