Opa, gostaria de saber se existe diferença em declarar Width: auto ou width: 100%
Obrigado
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Opa, gostaria de saber se existe diferença em declarar Width: auto ou width: 100%
Obrigado
Oi Rodrigo, tudo certo?
O 100% vai ficar com 100% da largura do elemento pai, não importando se esse elemento (o filho) tem uma borda ou padding, o que acaba fazendo com que o filho "vaze" do elemento pai.
Já com o auto, se o elemento filho tiver uma borda/padding, ele vai se ajustar para que não ocorra esse "vazamento".
Fiz essa imagem aqui, talvez fique mais claro:

Fiz esse Jsbin com o mesmo resultado da imagem acima.
Ah, hoje até temos uma propriedade para que o comportamento desses dois, 100% e auto, se comportem da mesma maneira, a box-sizing. Você pode conferir o suporte tela, que já está bem ok, aqui no Can I Use.
Espero ter ajudado,
Abcs!
Ah, entendi. No caso se eu usar o box-sizing eles se comportarão da mesma forma.
Valeu Natan, abraço ;)
Rodrigo,
Exatamente. Depois marque minha resposta como solução para darmos o tópico como solucionado?
Abcs!