0

I've got 2 div tags: Div A and Div B. If Div B is hovered, then I need to changed background color of Div A. Can this be achieved with pure css only? I have already tried "~" "+" ">"

eye
  • 15
  • 3

3 Answers3

0

Use Adjacent sibling selector +

<div class="a"></div>
<div class="b"></div>

.a:hover + .b {
   background-color: red;
}

according to your previous words, this should be it. but let me know if your structure is more complex than this

Harsh
  • 1,072
  • 1
  • 10
  • 16
Andrew
  • 2,810
  • 4
  • 18
  • 32
  • In your code the bgcolor of B will changed what I'm asking is what if the reverse, when I focus/hover on B the bg color of A will changed.Thankz – eye Jul 10 '15 at 13:02
0
B:hover 
{
    background: #code;
}
Anuj Garg
  • 584
  • 7
  • 22
  • if you can read the title then read back..op wants to change the background color of div a on hover of b..and use background-color rather then background when you know op wants to change color.. – Leo the lion Jul 10 '15 at 11:34
  • But the description is different. – Anuj Garg Jul 10 '15 at 11:36
  • if you can read other answers or comment then you can see what everyone got.it was typo..sorry m not being rude but you should not mark these as answer..it can lead to wrong way.. – Leo the lion Jul 10 '15 at 11:39
0

I'm assuming you want to hover A and change CSS of B

You may want to try this

.A,
.B{
  width: 50px;
  height: 50px;
  border: 1px solid #000;
}

.A:hover+.B{
  background-color: red;
}
<div class="A">A</div>
<div class="B">B</div>
Siddharth Thevaril
  • 3,722
  • 3
  • 35
  • 71