0

Acually i'm new in web designing and i'm working on menu. But i'm facing problem in decorating hover...See Code Below and help me...Thanks

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Design By Jagdeep</title> <link rel="stylesheet" type="text/css" href="style.css"> <link rel="stylesheet" type="text/css" href="normalize.css"> </head> <body> <nav class="nav-bar"> <div class="nav-hold"> <a href="#" class="logo"><img src="../Documents\22-1-2016\img/logo.png" alt="logo"></a> <ul class="nav-list" id="nav"> <li><a href="#">Home</a></li> <li><a href="#">Service</a></li> <li><a href="#">About</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Contact</a></li> </ul> </div> </nav> </body> </html



body {
    font-family: open-sans;
    font-size: 100%;
    font-weight: normal;
}

a {
    text-decoration: none;
}

/* WIDTH SETTING */

.nav-hold{
    width: 98%;
    max-width: 1180px;
    margin: 0 auto;
}

/* NAVIGATION SECTION */

.nav-bar{
    width: 100%;
    background: #2e4053;
}

.nav-hold{
    overflow: hidden;
}

.logo{
    float: left;
    display: block;
    padding: 0 10px;
    color: #f9f9f9;
    font-weight: 600;
}

.nav-list{
    float: right;
    list-style-type: none;
}

.nav-list li {
    float: left;
}

.nav-list li a {
    display: block;
    padding: 0px 10px;
    color: #f9f9f9;
}

.nav-list li a:hover {
    background: #fff;
    color: #2e4053;
}
3
Contributors
2
Replies
12
Views
1 Year
Discussion Span
Last Post by mexabet
0

I can see that on hover the background color changes to grey and font color changes to black. What exactly do you want to achieve that is now working?

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.