não entendi muinto bem sua pergunta, mas arriscando responder a medida de tamanho px representa absolutamente quantos pixels relativos o seu elemento HTML vai ocupar na tela então 50px representa um espasso menor que 500px

boa noite eu também não soube explicar muito bem mais quando eu colocava o widch 50px igual o professor mostra para min encolhia tido igual esta na imagem então alterando o valor do widch ate para ver se resolvia quando o numero de 500px e que ficou parecido ao que professor mostra

olha eu eu teria de avaliar melhor mas creio que seu código esteja com alguma diferença pequena, algo de uma ou duas linhas um ; no lugar errado algo assim costuma dar esses bugs. tenta verificar linha a linha seu código ou baixar o zip mais atual com os arquivos do projeto com tempo você encontrará o motivo do bug. mas como eu disse o funcionamento do width é o tamanho px são daquela forma que se comportam. Fica aqui uma dica de artigo sobre o assunto https://www.alura.com.br/artigos/guia-de-unidades-no-css

Se eu entendi direito, voce está aplicando o css para alterar o tamanho do botao de enviar o formulario, e ao colocar 50px ele diminui. Isso deve acontecer porque o tamanho padrão dele é maior do que 50px. Você pode usar porcentagens para aumentar o botão, lembre que o tamanho inicial é de 100%, então para dobrar de tamanho, 200%.

Se não me engano, o professor aumentou em 20%, e escreveu isso como número, não porcentagem. 120/100 = 1.2, quando colocar o tamanho, irá multiplicar o tamanho atual por 1,2.

O comportamento do seu CSS está correto. O problema é que você usou a medida em pixels, então quando você sobe de 50px pra 500px ele realmente vai ficar maior. No caso, fazer a substituição do 50px por 50% já vai resolver seu problema e fazer com que os inputs ocupem exatamente metade do espaço!