Solucionado
Não entendi muito bem a diferença entre o 'display: inline' e 'display: inline-block'. Por que na lista de navegação é utilizado o display:inline e os elementos da lista se organizam um do lado do outro, e já na lista de produtos é preciso usar o inline-block pra essa configuração?
Fala May, tudo bem?
A diferença é que elementos com display: inline; não pode ser definido height e width para eles, ao contrário do display: inline-block os elementos aceitam que seja definido os respectivos atributos css.
Espero ter ajudado :D
Olá May,
Complementando a resposta do Matheus:
Em casos onde você só precisa que os itens estejam um ao lado do outro e não precisa mexer nas suas dimensões, faz sentido utilizar apenas o inline, como é o caso da lista de navegação. No entanto, quando você necessita alterar as suas dimensões e inserir elementos um ao lado outro, é necessário utilizar o inline-block, como é o caso da lista de produtos.
Bons estudos!
Entendi. Muito obrigada aos dois!