CODEWITHSUNDEEP
javascripthtmlcss
rabbitforpm
rabbitforpm

Reputation: 17

Using css/js, hide <h2> in a div when hovered over

What I've tried (css):

div:hover #h2 {
  color: transparent; 
}

I want to hide text in a div like this:

<div>
  <h2>text</h2>
</div>

Upvotes: 0

Views: 952

Answers (2)

Armin Ghasemi
Armin Ghasemi

Reputation: 381

this will hide H2 tag on DIV hover

div:hover h2{
    display: none; 
}

if you need fix height in your DIV you can use this one:

div:hover h2{
    visibility: hidden; 
}

UPDATE: duo to questioner comment, if you want to use a specific id, do like this:

<div id="spdiv"><h2>message</h2></div>

and in css

#spdiv:hover h2{
    display: none; 
}

using # helps you to specify element id

Upvotes: 2

Jeroen Noten
Jeroen Noten

Reputation: 3624

You should remove the #:

div:hover h2 {
    color: transparent; 
}

A # indicates an id instead of a tag name (so you were selecting id="h2").

Upvotes: 7

Related Questions