0

Im tring to display and hide a div with some text according to a mousehover on a link element that is in other place of the documnet:

HTML:

    <ul class="black-white one-on-two" id="hidden-menu">
        <li><a id="showhim" href="#">SHOW HIM?</a></li>
        <li><a href="#">HOW?</a></li>
        <li><a href="#">WHO?</a></li>
    </ul>
    <div class="one-on-two" id="showme"> SHOW ME</div>

CSS:

#showme {
   display: none;
}

#showhim:hover #showme {
   display: block;
}

why and how can I make it work with only css and HTML ?

Aviad Amar
  • 37
  • 2

1 Answers1

0

Your CSS rules are not correct. You're calling the wrong IDs in it.

Its not possible with just HTML and CSS. HTML is for markup, and CSS is for styling.

You're trying to do some logic, which none of the two can do.

You'll need some JavaScript, that will listen for a hover event and change the display attribute of the other div to be shown or hidden.

Professorval
  • 183
  • 2
  • 10