Как изменить цвет страницы активной навигационной страницы

Question

Итак, я нашел нить CSS: How to change colour of active navigation page menu и пытался это сделать, но не имел успеха.

Вот мое меню:

Вот мой CSS:

/***************************/ 
/* Genral Navigation Rules */ 
/***************************/ 
#navMain { 
    text-align: center; 
    margin:-70px ; 
} 
#navMain ul { 
    margin: 0px auto; 
    padding:0px; 
} 

#navMain ul li { 
    margin: 0px auto; 
    padding:0px 20px; 
    list-style:none; 
    display:inline; 
} 

#navMain ul li a { 
    margin: 0px auto; 
    padding:0px; 
    color: #FFFFFF; 
    text-decoration:none; 
    font-weight:normal; 
    font-size: 19px; 
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; 
    text-transform:uppercase; 
} 

#navMain ul li a:hover { 
    text-decoration:underline; 
    color: #EF7D50; 
} 
#current { 
    color: #EF7D50; 
} 
#current a{ 
    color: #EF7D50; 
} 

Вот jsfiddle за то, что я в настоящее время.

Answer 1

Как насчет

#navMain #current a{ 
    color: #EF7D50; 
} 

Проблема заключается в том, что ваш #navMain ul li a правило более специфично, чем #current a поэтому он имеет преимущество ..

Использование двух идентификаторов для вышеуказанного правила #navMain #current a делает его более конкретным и поэтому он применяется ..