1
resposta

[Dúvida] site em telas maiores

Pessoal, fiz todo meu projeto usando o monitor do notebook, segui todos os códigos de acordo com a aula. Porém, em telas maiores, o design fica completamente fora de alinhamento. Teria que definir o tamanho do width todo para dar certo?

1 resposta

Olá, Priscilla. Tudo bem?

Não necessariamente você precisa definir o tamanho do width para que seu projeto funcione corretamente em telas maiores. O que parece estar acontecendo é que seu design não está sendo responsivo o suficiente para se adaptar a diferentes tamanhos de tela.

Existem várias técnicas que você pode usar para tornar seu design mais responsivo:

Usar unidades relativas:

Em vez de definir tamanhos fixos como pixels, você pode usar porcentagens, unidades de viewport (vw, vh) ou unidades flexíveis (em, rem) para dimensionar elementos com base no tamanho da tela.

Media queries:

Use media queries em seu CSS para aplicar estilos diferentes com base no tamanho da tela. Por exemplo, você pode ter regras de estilo específicas para telas pequenas, médias e grandes.

Layouts flexíveis ou de grade:

Utilize layouts flexíveis (flexbox) ou de grade (CSS grid) para organizar seu conteúdo de forma que se ajuste automaticamente ao tamanho da tela.

Teste em vários dispositivos:

Certifique-se de testar seu projeto em diferentes dispositivos e tamanhos de tela para identificar problemas de layout e fazer ajustes conforme necessário. Utilize o inspecionar do navegador para fazer os teste em vários tamanho de tela.

Se o seu design está completamente fora de alinhamento em telas maiores, é provável que seja necessário revisar e ajustar seu código CSS para torná-lo mais responsivo. Experimente as técnicas mencionadas acima e veja qual funciona melhor para o seu projeto.

Caso tenha ficado alguma dúvida, sinta-se à vontade em comunicar, estou à disposição em poder ajudar!

Um forte abraço e bons estudos!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software