1
resposta

[Dúvida] Visualização no navegador

Refiz o código algumas vezes, mas a visualização no navegador só fica equilibrada em 67%. Quando altero para 100% fica tudo espremido. Era para ser assim mesmo?

1 resposta

Olá! È dificil dixer qual é o problema certa sem código mas parece que seu layout está se comportando de forma inesperada quando você altera a largura para 100%. Algumas possíveis causas e soluções.

O container-pai está limitando o espaço. Se os elementos estão dentro de um container com largura fixa, tente usar width: 100% nele também:

.container { width: 100%; max-width: 1200px; /* Ou outro valor adequado */ margin: 0 auto; }

Isso evita que os elementos fiquem espremidos ao ocupar toda a tela.

As divs estão com width: 100%. Se cada div dentro do container estiver com width: 100%, pode ser que estejam ocupando toda a linha e "espremendo" o conteúdo. Em vez disso, tente definir uma largura máxima:

.div { width: 100%; max-width: 600px; /* Ou qualquer outro valor adequado */ }

Isso impede que os elementos cresçam indefinidamente.

O box-sizing está atrapalhando o layout. Se houver padding ou border, pode ser que a largura esteja ficando maior do que o esperado. Uma forma de corrigir isso é garantir que box-sizing esteja configurado corretamente:

{box-sizing: border-box;}

Isso evita que padding e border aumentem o tamanho real dos elementos.