Q: link functions wont work My code won't work, I am trying to change the color of my links (will add more specs later) but it won't change. The functions are not performed. I tried changing classes, adding id's, but nothing works.  Could someone tell me how to fix it please.
CSS 


       a:link.NB {

         color: red;

       }

       a:visited.NB {

         color: blue;

       }

       a:hover.NB {

         color: #green;

       }

       a:active.NB {

         color: #423243;

       }
<nav id="N_bar">
  <ul>

    <li><a class="NB" href="#">Men</a>
    </li>
    <li><a class="NB" href="#">Women</a>
    </li>
    <li><a class="NB" href="#">Children</a>
    </li>
    <li><a class="NB" href="#">Apparel</a>
    </li>

  </ul>
</nav>



A: You have a few problems here.


*

*At the end of the CSS styles, you didn't close #M_section

*#green should be simply green
See fiddle

A: Please check this
a.NB:link {
    color: red;
}
a.NB:visited {
    color: blue;
}
a.NB:hover {
    color: green;
}
a.NB:active {
    color: #423243;
}


A: Check this code .I hope solve your problem :
It's your code I'm just change     #green to     green 
and close     #M_section
<!Doctype html>
<html lang="eng">
<head>
<style type="text/css">
* {
    margin:0px;
    padding:0px;
    list-style-type:none;
    }

body{
        background-image:url("Aba2.jpg");
    text-align:center;
    }
    header, section, footer, aside, nav{display:block}

    #Wrapper{
     border: 2px solid blue;
     width:1000px;
     margin:20px auto;


    }
    #H_wrap{
     padding:10px;
     border:2px solid yellow;
     background-image:url("Abracci1.jpg");
    background-repeat:repeat-x;


    }

    #M_head{
    padding:10px;
    font:italic bold 34px/30px "Times New Roman" Times, arial;
    Text-align:center;
    color:#000000;
    text-shadow:2px 2px #999999;
    text-decoration:underline;

    }

    #N_bar {
    padding:20px;
    text-align:center;
    word-spacing:6em;
    font:italic bold 25px/30px "Times New Roman" Times, arial;
    text-shadow:3px 3px #999999;
    }

     a.NB:link {
     color:red;
    }
     a.NB:visited{
     color:blue;
    }
     a.NB:hover{
     color:green;
    }
     a.NB:active.NB{
     color:#423243;
    }


    #N_bar li{
    display:inline-block;
    }

    #M_section{
     background-image:url("Aba3.jpg");
    float:left;
    clear:both;
}
</style>
    <meta charset="uft-8"/>
     <link rel="stylesheet" href="Abracci_main.css"/>
   </head>

   <body>
      <div id="Wrapper">
       <div id="H_wrap">

         <header id="M_head">
         Abracci
         </header>


         <nav id="N_bar">
             <ul>

                 <li><a class="NB" href="###">Men</a></li>
                 <li><a class="NB" href="##">Women</a></li>
                 <li><a class="NB" href="#$">Children</a></li>
                 <li><a class="NB" href="#@">Apparel</a></li>
             </ul>
         </nav>
         </div>
         <section id="M_section">


         </section>
         <aside id="M_aside">

         </aside>
         <footer id="M_footer">

         </footer>

      </div>



</body>
</html>
<HTML>


If after a once those color doesn't change .clear your browser history . 
