Alessio Di Marco Alessio Di Marco - 9 months ago 49
CSS Question

Css hover div to show another div

I'm having some trouble about css hover effect.
I have external container within 2 div.In left div i need hover effect that show right div(previously hidden).

I'll report code

<div class="block-attr">
<div class="left"></div>
<div class="right">Hidden text </div>

but this instruction (right div it's hidden with display:none;) seem not to work.

.block-attr .left:hover .right{display:block;}


You can use the adjacent selector + to do that. Check below example

Read more here :

.right {
  display: none;
.block-attr .left:hover + .right {
  display: block;
<div class="block-attr">
  <div class="left">Hover here</div>
  <div class="right">Hidden text</div>