Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

TAGs x Classes no CSS

Boa tarde!

Minha dúvida não é exatamente referente à aula que estou, mas que venho tendo com frequência. Se trata de qual tag colocar no CSS, ou classe. Por exemplo, nesse ultimo exercício (Projeto #3 - Design mais fluído), foi necessário colocar .menu-principal li {}para o código funcionar. E muitas vezes erro ou o código não funciona, justamente pelo fato de eu não colocar a tag certa, ou a especificidade correta no CSS. O mesmo para as outras classes que foram usadas: .barra-nav e logo após o .menu-principal. Por que a necessidade de usar esses dois para o inline-block / vertical align, e para o float: left, usar o .menu-principal li?

Talvez tenha ficado um pouco confuso a minha duvida, mas espero ter conseguido expressá-la.

1 resposta
solução!

Oi André!

Acho que entendi sua dúvida, mas me corrija caso contrário.

A ideia é que cada seletor desses vai atingir exatamente o elemento que queremos estilizar. Então quando usamos por exemplo .menu-principal li estamos estilizando o <li> dentro do elemento com classe menu-principal. Já quando usamos o seletor apenas com .menu-principal estamos estilizando a tag <ul class="menu-principal"> do menu em si.

Nos meus projetos hoje, pra diminuir essa confusão, tenho preferido colocar classes no máximo de elementos possíveis. Então poderia fazer algo como <li class="menu-principal-item"> e usar no CSS .menu-principal-item (ao invés de .menu-principal li)