Member Avatar for Designfiver

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
  • 151 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by mexabet
Member Avatar for gentlemedia

Okay... and do we have to guess what the problem is?

Member Avatar for mexabet

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?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.