CSS :hover div elements

Question

My css: .sec-hover :hover {background:pink;}

My div:<div class="sec-hover"><h2>heading</h2><p>paragraph</p></div>

With this code, the whole div does not hover in pink. On hover the h2 and p elements hover pink separately. How do I get the whole div to hover pink?

Nayana_Das · Accepted Answer · 2017-02-25 11:54:35Z

5

No space before colon : , Try this :

.sec-hover:hover{
background: pink 
}

answered Feb 25, 2017 at 11:54

Nayana_Das

1,8154 gold badges24 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

neophyte · Accepted Answer · 2017-02-25 11:56:34Z

1

Use background-color

.sec-hover:hover{
background-color: pink 
}

<div class="sec-hover"><h2>heading</h2><p>paragraph</p></div>

answered Feb 25, 2017 at 11:56

neophyte

6,6322 gold badges32 silver badges43 bronze badges

Momin · Accepted Answer · 2017-02-25 11:57:17Z

0

Try This ! Used proper syntax ;

.sec-hover:hover{
background:pink;
color:white;
}

<div class="sec-hover">
  <h2>heading</h2>
  <p>paragraph</p>
</div>

answered Feb 25, 2017 at 11:57

Momin

3,3163 gold badges35 silver badges52 bronze badges