Olá Samuel, tudo bem?
Rodei o projeto no firefox 89.0 e no Microsoft Edge Versão 91.0.864.48 (Compilação oficial) (64 bits), que é a mais recente e em ambos os navegadores o projeto está da forma esperada. Recomendo você baixar a versão mais recente do Edge e testar.
Muitos podem ser os motivos para essa incompatibilidade, que é bastante comum entre os navegadores e suas versões. Para termos um projeto que se adapte em diversos browsers, é necessário fazer uma série de adaptações em nosso CSS, para que ele se comporte de maneira adequada em ambientes diferentes.
Uma das adaptações necessárias, seria acrescentando o arquivo reset.css ao projeto. Você poderia verificar se está utilizando esse arquivo? Se não estiver, você poderá baixar o zip aqui.
Caso esteja utilizando, verifique se ele está sendo aplicado de maneira correta no código.
Após ser baixado, o arquivo reset.css deverá estar na mesma pasta que o style.css e index.html, assim como foi feito nas aulas. Em seguida, no arquivo HTML da páginda de produtos você irá chamar o arquivo reset.css dentro da tag <head>
, assim como fez com o style.css anteriormente.
<head>
<meta charset="UTF-8">
<title>Barbearia Alura</title>
<link rel="stylesheet" href="reset.css">
<link rel="stylesheet" href="style.css">
</head>
Atenção, é essencial que o arquivo reset.css esteja escrito acima do style.css, assim como foi feito no exemplo acima.
Como disse, são muitas as possibilidades e é bem difícil sabermos o que de fato está ocorrendo.
Se quiser aprender mais sobre incompatibilidades, vale a pena a leitura:
Aguardo para saber se deu certo, abraços!