Como deixar o Layout Responsivo no seu site |

[@alura]

➡Se interessou? Venha estudar a nossa formação de HTML e CSS para projetos web: www.alura.com.br/formacao-html-css

[@mauricioaugusto642]

A Alura me surpreendeu demais. Achei uma das melhores plataformas para aprender programação. Gosto de usar muito para relembrar conceitos básicos.

[@alura]

Que feedback legal, Maurício. 🥹💙 Pode contar sempre com a gente, viu? É um prazer mergulhar com você nessa jornada. E se precisar de qualquer apoio com os estudos, pode nos chamar! 😉

[@Mognatti]

Os cursos dessa instrutora são muito bons. Essa mina é braba dms

[@alura]

El é incrível, né?! A gente fica feliz demais em saber que curte os cursos. 🤿💙

[@samuelferreira5745]

simples e objetivo. Alura a melhor escola de Tecnologia.

[@alura]

A gente fica feliz demais com feedbacks como esse, Samuel! 🥰 Obrigada por mergulhar com a gente nessa jornada. 💙

[@BorisZaidan]

Mais de 2 semanas quebrando a cabeça, para colocar uma tela de login responsiva, assistir seu video em menos de 15 minutos consegui. obrigado!!

[@angelosilvanno]

Alura é a melhor plataforma de Tecnologia, 😊

[@alura]

Obrigada pelo reconhecimento, Angelo! É um prazer mergulhar no mundo da tecnologia com você! 💙

[@higorproenca2648]

Excelente! Esse vídeo veio em um ótimo momento em que eu preciso justamente adaptar uma página para outros dispositivos

[@alura]

Que bom saber que te ajudamos, Higor! 🥰 Obrigada por nos acompanhar 💙 Pode contar com a gente!

[@alexgondev]

Eu fiz esse curso. Muito bom. Ótima didática!

[@alura]

Que bom que curtiu, Alex ! Valeu pelo carinho 💙

[@CynaraPeixoto]

Eu tenho um Yoda igualzinho a ele! Comprei pra decoração do quarto do meu bebê, que era todo decorado com coisas do Star Wars (antes de voltar a ser modinha por conta de Disney)

[@maumauriciogc]

Olá estudo fullStack Java na ebac e estou com vocês no front-end, gostei da forma como resolveu o problema. Tem algum livro explicando estes comandos para tornar o site responsivo em CSS ? muito obrigado. ahh excelente explicação!

[@klebercoelho99]

putz, me ajudou d+ esse vídeo, aprendi umas técnicas que eu não sabia, vlwwwwwwwww

[@alura]

Que ótimo saber que te ajudamos, Kleber! 🤩 Obrigada por nos acompanhar, conta com a gente! 💙

[@matheusporezeli1555]

Mônica melhor instrutora😊❤️

[@alura]

Mônica é incrível mesmo! 💙

[@nossamusik]

Existem inúmeras resoluções de celulares, para cada uma delas o layout vai sofrer mudanças, sem falar, das sobreposições que acontecem, ou seja, você ajusta uma responsividade para uma tela, quando vai ajustar para outro dispositivo, desconfigura o que fez antes.

[@FzAndrade]

você pode fazer a mesma coisa incluindo todos os tipos de layout (ou a maioria deles).

[@oviniciosneves]

Sou fã da Moni!

[@alura]

A Moni é incrível mesmo 🤩💙

[@Quitti.1]

Então basicamente, eu preciso abrir a condição ali no começo e depois ir alinhando tudo, de acordo com as classes que tenho no site, um por um, seguindo e olhando o modelo "mobile", certo?

[@nossamusik]

Porque vc usa "vh" e "2em" ao inves de "%" e "px" ?

[@FzAndrade]

olha na documentação

[@raulenriquefishman2616]

Parabens pelo Português. Vamos "SE" aventurar.

[@decocury3477]

por favor, tenho uma dúvida. É possível pegar um site feito no Canva e exportar um HTML dele? Preciso colocar a tag do Google e não consigo

[@danielleitepereira6766]

Alguém sabe onde eu acesso o curso para criar esse site do zero?

[@alura]

Oie, Daniel! 🤗 O curso é esse aqui: www.alura.com.br/curso-online-html-css-praticando-html-css Se precisar de alguma ajuda durante seus estudos, pode nos chamar! 😉💙

[@HanielFialho]

Sensacional

[@alura]

Ficamos felizes que esteja gostando, Fialhão 💙

[@jonathansoares7936]

Uma coisa que fico em dúvida, é normal algumas telas de celulares ficarem diferentes, as vezes cortadas? tem cel de largura menor que n fica legal... teria que fazer várias medias pra cada tipo de cel? Não é assim que vejo no curso, então queria entender melhor. Wuando tem figma só usam um número pra responsividade mobile. Só que não é todos os cels ficam bons. O que fica bom em um de 414px, não fica legal no de largura 360px por exemplo. Tem algo a mais que usa pra ficar perfeito de fato em todas as telas mobile?

[@antonioevaldo4325]

Oi, Jonathan, tudo bem? Ao codificar páginas web, o ideal é que não hajam bugs ou problemas de layout, independente do tamanho de tela. Uma gama de tamanhos de tela que sugiro que o seu site seja responsivo seria de 360px a 2048px, que certamente já comporta a grande maioria dos usuários. O ideal é que a pessoa designer faça o design do mesmo site para diferentes tamanhos de tela (no figma, por exemplo), normalmente atendendo celulares, tablets e computadores. Então é comum ver um figma onde cada página do site tem três versões de tamanho dela, por exemplo: 360px, 768px e 1440px. E quanto aos tamanhos de tela superiores a 1440px ou que estão entre esses valores? Nesse caso, cabe a nós termos a habilidade de construir código HTML e CSS que se adapte bem a praticamente qualquer tamanho de tela, e isso envolve uma série de boas práticas, para além das media queries, como: evitar medidas absolutas e utilizar medidas que se adaptem ao tamanho da tela ou ao elemento pai; utilizar flexbox e grid para ajudar os elementos a se posicionarem de forma dinâmica; evitar definir larguras fixas; entre outras práticas. Espero ter ajudado!

[@guteninja764]

The goat os back

[@tales890]

Ela ensina bem. Só que ai já é pra quem tem uma boa base msm.

[@romeumaier1838]

hundredth like