Saudação para todos,
sou novo como programação em Frond-End, e estou começando a aprender a mexer com @media para aplicar chaveamento em uma pagina simples,mas o que seria cheveamento?
Criei um site responsivo quando a pagina tem mais de 991px de largura ele aparece o menu, porém quando ele tem menos de 991px aparece um ícone de três barrinhas, e se o usuário quer que apareça o menu estando a menos de 991px ele terá que clicar no ícone para aparecer o menu, como mostro na figura abaixo;
Menu acima de 991px;
Agora o menu a baixo de 991px sem clicar no ícone.
Agora o menu quando clicar no ícone.
O que preciso na verdade é mudar e tira o sublinhado quando passo o mouse, a parte do código responsável por isso seria esse;
@media(max-width: 991px){
.menu{
position: fixed;
top: 0;
left: 0;
bottom: 0;
width: 200px;
display: none;
background-color: #bfbfbf;
border-right: 1px solid #eee;
}
.menu a{
text-decoration: none;
}
.menu--exibindo{
display: block;
}
.menu_item{
display: block;
line-height: 3;
}
}
Mais especificamente essa parte do código referente ao que foi mostrado logo em cima;
.menu a{
text-decoration: none;
}
O problema é que esse código como mostra em cima não faz alteração no menu, era para fazer, eu não sei aonde estou errado.
Deixarei o meu código fonte completo que está no GitHub disponivel para melhores esclarecimentos.