How to implement navigation bar hover effect

Question

I'm working on my vertical navigation bar. The name of that icon should be visible on the right. The name is also supposed to change from white to black when the mouse is over the icon, but it's not working.

I tried changing the tags around to see if that helps. I also changed the tag in the HTML and changed the tag in the CSS to make the tag work. I looked on this site for a solution to my problem. I can't get my navigation bar to work.

I can't figure out how to put the code here. I'm willing to send my code via message if it can help. I spent over 30 minutes trying to figure out how to post the code.

First time using this website.

I've rewritten the code multiple times, rejigged the tags, looked up tutorials, and tried contacting the web developer, but can't resolve the issue.

Again, I'm willing to send the code via message, it's easier for me than posting the code here since that's a bit difficult for me.

Answer 1

If you want to change the color from white to black on hover and set it to be visible, you can always set it to black by doing the following

.icon_name {
        visiblity:hidden;
        color:black;
    }
   .icon:hover {
      icon_name {
         visiblity: visible;
      }
   }

However, if you want the name to be visible on both the right and left sides, you can follow the same approach but rename the icon_name to right_icon_name and left_icon_name.