Boa noite, gostaria de saber porque o professor coloca o valor da propriedade main como: 0 auto, sendo que auto em teoria, não deveria centralizar? Pois acho que não foi o que aconteceu. E também, por que é preciso colocar o 0? Já que tentei colocar main: auto, não mudou absolutamente nada. Obrigada desde já!
Olá amanda coloque uma cor de fundo para verificar se realmente não funcionou. Como base funciona da seguinte forma:
sua tag deve ser display: block; e ter uma largura definida.
Caso contrario, um display: block sem largura ocuparia 100% da largura do elemento pai, não podendo ser centralizado (existem algumas outras propriedades que podem afetar isso, um dia chegamos lá)
Agora referente ao margin: 0 auto; isso é uma abreviação de:
.seletor {
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: 0;
}Você pode abreviar das seguintes maneiras:
1 - Na ordem do ponteiro do relógio os parâmetros são: em cima, na direita, em baixo e na esquerda
.seletor {
margin: 0 auto 0 auto;
}2 - Aqui os três parâmetros são em cima, nas laterais e em baixo
.seletor {
margin: 0 auto 20px;
}3 - Aqui com dois parâmetros, cima/ baixo, e o segundo são as laterais (esquerda/direita)
.seletor {
margin: 0 auto;
}4 - O último com apenas um parâmetro como no seu caso é todos os lados
.seletor {
margin: 0;
}Logo, colocar margin: auto; não necessáriamente é a mesma coisa, você está definindo que em cima e em baixo é auto (todos os lados), e por isso o professor utilizou zero, pois na verdade é zero mesmo.
Caso tenha solucionado seu problema marque como "Resolvido" para que a resposta possa ajudar outros com as mesmas dúvidas.