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

Aula 5 atividade 3 MARGIN: AUTO;

Um bom dia a todos.

Durante o exercicio 5 da atividade 3 foi solicitado que deixássemos o texto com 720px e centralizado. O exercicio diz o seguinte: "Essa tag

que deverá ter 720 pixels de largura. Para centralizá-la, precisamos empurrá-la para longe da borda da página, ou seja, precisaremos definir um valor para o margin-left dela. Como não é possível saber a largura da janela do navegador do usuário, vamos pedir para o navegador calcular esse valor para nós. Mais precisamente, vamos pedir para o navegador redistribuir o espaço que sobra à direita da
após definirmos sua largura para 720 pixels. Para isso, usamos o valor auto tanto na margem esquerda como na direita."

Eu não entendi como isso funciona direito, quer dizer, como o atributo AUTO trabalha centralizando? verifiquei que se eu mudar para margin-left e colocar "AUTO" ele joga o margin-right para 0 colocando a div colada do lado direito da tela... Enfim, não entendi muito bem a explicação desse texto, alguem poderia me explicar com outras palavras por gentileza?

Obrigado a todos.

Ótimos estudos!

2 respostas
solução!

Opa, Leandro, tudo bom?

Essa dúvida e comum e faz bastante sentido. O comportamento do margins left e right auto é o seguinte. O elemento vai receber o valor correspondente ao máximo que o elemento pode ser "empurrado", baseado no lado que você está mexendo.

Indo direto ao ponto se um elemento tem margin left auto, ele vai receber um valor de left o máximo possível para empurrar o elemento (por isso ele fica na direita). Para o margin right o mesmo se aplica só que ao contrário

Segue um exemplo para deixar mais fácil visualmente https://codepen.io/soutomario/pen/gGxJGj

Espero ter ajudado :)

Mario, muito show..

Agora ficou mais claro para mim.

Muito obrigado pela atenção e pelo seu tempo. =)

Um excelente dia para você !