Your li:last-child
selector refers to the li
element, not its a
element. Since there isn't a right border on the li
element itself to override, that ruleset has no effect.
You need to make sure you select the a
within that li:last-child
since the right border is declared on a
in your following ruleset:
nav.nf ul li:last-child a
{
border-right:none;
}
Also, your DOCTYPE appears to be malformed; it should be <!DOCTYPE html>
. There must not be a space after the !
, and the html
identifier must be there.
On an unrelated note, it's worth pointing out that you do not have to declare the same transitions on each of your nav.nm ul li<class> a:hover
rules. You can just declare it on the general nav.nm ul li a
rule and the transition will take effect when any of the links are hovered. And the unprefixed transition
property should come last:
nav.nm ul li a
{
color:#ffffff;
padding:15px 16px;
-webkit-transition:450ms ease;
-moz-transition:450ms ease;
transition:450ms ease;
}
nav.nm ul li.white a:hover
{
background-color:#ffffff;
color:#000000;
}
nav.nm ul li.red a:hover
{
/* ... */
}