0
I’m making a sort of card button inside a tag to create a link (bootstrap 4 beta). On the card there is a class that changes its background-color to a light blue. I want this card to turn dark blue when I put the mouse up, but I can’t because it has the external link. How do I make the condition that by giving Hover on the link it changes the background of the card that is inside? Follow the code:
<a class="link-dashboard" routerLink="#">
<div class="card menu-dashboard text-white bg-azul-claro">
<div class="card-body pb-0">
<i class="fa fa-newspaper-o float-right fa-5x" aria-hidden="true"></i>
<h5 class="mb-0">NOVA POSTAGEM</h5>
<p>Publique uma notícia!</p>
</div>
</div>
</a>
a.link-dashboard{
text-decoration: none;
}
.bg-azul-claro{
background-color: #87CEFA;
}
.bg-azul-claro:hover{
background-color: rgba(36, 161, 238, 0.53);
}
HEX
andRGBA
are practically the same so you don’t understand the difference inhover
– Lauro Moraes