Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Porque fazer uma classe "produtos" ao invés de usar "main li"?

Porque fazer uma classe "produtos" ao invés de usar "main li" em teste deu o mesmo resultado.

}
.produtos li {
    display: inline-block;
}

Teste que chegou no mesmo resultado
}
main li {
    display: inline-block;
}

2 respostas
solução!

O resultado é o mesmo. Mas não é uma boa prática aplicar estilos diretamente nas tags do html.

Pense o seguinte: E se na mesma página você tiver uma lista de produtos, preços e benefícios? No segundo exemplo você aplicará a estilização para todas as li na página. E se mesmo assim todas as listas tiverem a mesma estilização, fica difícil a manutenção. Agora veja outro cenário:

HTML:

<ul class="produtos">
    <li class="produtos__item">Produto</li>
</ul>

<ul class="beneficios">
    <li class="beneficios__item">Beneficio</li>
</ul>

<ul class="precos">
    <li class="precos__item">Preço</li>
</ul>

CSS:

.produtos, .beneficios, .precos {
    display: flex;
}

Se chegar em algum momento, e eu não quiser mais que a lista de produtos tenha o display flex basta buscar pela classe, entende?

Olá Rodrigo!!

Muito obrigado pela explicação, salvando de novo ahhaa parabéns pela proatividade no fórum.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software