aulas de hierarquia CSS e IDs

Question

Estou construindo um menu utilizando XHTML, CSS e jQuery e eu tive um problema com meu CSS. Aqui é a minha página de teste e aqui é o meu css.

O que eu estou tendo problemas com é que a minha classe .subMenu é herdar as propriedades da minha #menu, as cores e tamanhos de fundo são a mesma coisa. Eu estou procurando uma solução que folhas .subMenu como uma classe para que eu possa voltar a usá-lo. Eu tenho que trabalhar, alterando .subMenu a um ID. O estranho é que eu editar algumas das propriedades no meu código jQuery usando a classe .subMenu e muda os.

Então eu queria saber se alguém poderia me informar como corrigi-lo e se ele era uma questão de hierarquia se pode explicá-lo.

Obrigado, Levi

Answer 1

Eu acho que o problema é que o #menu> li um vai aplicar esse estilo a todos os links dentro das tags li, então todas as tags li dentro do submenu também terá este modelo. Parece-me que a única diferença está nas cores de fundo e de primeiro plano no foco, para que você possa corrigi-lo, alterando #menu> li um e #menu> li a: hover a ser #menu> li> um e #menu> li> a: hover. Desta forma, os estilos para o menu de nível superior serão aplicadas apenas às ligações que são diretamente após uma tag li que são diretamente após o item #menu. Os estilos de submenu pode permanecer o mesmo.