Galera estou com um problema! Estou tentando fazer com que ao dar o hover em um link ele mostre um texto abaixo falando sobre o que ele é.
Mais quero que somente quando eu passe o mouse sobre o link ele mostre o texto… Mais ao colocar ele dentro de uma div quando passo o mouse sobre a parte branca ele fica mostrando o texto do hover! Queria que a div tenha o mesmo tamanho do texto para não ter esse problema e que seja um modo que qualquer texto que eu use a div fique do tamanho dele sem que eu tenha que fazer na mão para cada link! Se alguém souber um modo!
<div class="some-div">
<a href="">Competências</a>
<p class="some-element">Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Maecenas id vulputate augue. Donec varius arcu in massa lobortis,
eu elementum nunc pharetra. Etiam eget odio ut libero semper ultrices ut nec lorem.
</p>
</div>
.some-element {
border: 1px solid #ccc;
display: none;
font-size: 10px;
margin-top: 10px;
padding: 5px;
text-transform: uppercase;
}
.some-div:hover p {
display:block;
}