Menu
I'm designing a webpage which has a menu bar with links on the page. I have a style sheet for it but I'm having trouble with the "hover" code. A piece of my code looks like:
<body>
<div id="wrapper">
<div id="menu">
<a class="mLink" href="main.php">Home</a>
With a css code:
body {
background-color:black;
text-align: center;
height:100%;
}
div#wrapper{
margin-right: 5%;
margin-left: 5%;
margin-top: 0%;
margin-bottom: 5%;
border: outset;
border-color: white;
}
a.mLink{
color: white;
font-size: 35px;
padding: 10px;
}
a.mLink:hover{
color: black;
}
a.mLink:active{
color:black;
}
div#content{
color: white;
font-size: 40px;
}
The "hover" and "active" both aren't working and I don't understand why. I've tried a lot of different style variations such as a:hover, #menu a:hover, #menu a.mLink:hover, and nothing seems to work. Any help would be much appreciated.
586
Perhaps you could include a screenshot of how it looks and tell us how it's supposed to look? I copied and pasted what you had into this jsfiddle and it works just fine to me. The only difference between what you posted and what I did was change the a:hover color to red and the a:active to yellow so you can see the difference instead of having black on black.
So can you post a screenshot of what's happening vs what you expect? If so, I'll update my answer accordingly.
200
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
