Ainda não tem acesso? Estude com a gente! Matricule-se
Ainda não tem acesso? Estude com a gente! Matricule-se

Curso Flexbox: Posicione elementos na tela

Nota

9.5

Nível

Intermediário

Última atualização

15/06/2018

Carga horária

9h

Iniciar Curso
Concluir

Pré-requisitos:

Instrutor

  • Formado em Sistemas de Informação pela USP, atualmente trabalha como desenvolvedor Full Stack e instrutor na Caelum e Alura. Seu emoji preferido é a Pusheen (gato gordo do amor).

Veja as últimas novidades do curso Veja as perguntas frequentes Fórum do curso

Conteúdo detalhado:

  1. Introdução e Cabeçalho da página

    1. Projeto Alurinha
    2. O que é flexbox?
    3. Nos livrando dos floats, inline e inline-blocks
    4. Espaçando os elementos com justify-content
    5. Alinhando verticalmente os elementos com align-items
  2. Fazendo o rodapé

    1. Mais formas de espaçamento com space-around
    2. Mudando a direção de renderização do flex
    3. Quebrando os elementos para outras linhas
  3. Fazendo o grid de cursos

    1. Juntando as coisas que vimos até agora
    2. Limitações do flex
    3. Fazendo um grid com flex
  1. Adaptando para mobile

    1. Fluxo dos elementos em um contexto mobile
    2. Mudando a ordem dos elementos
  2. Mais sobre flexbox & desafios

    1. Nomenclatura oficial do flexbox
    2. Fazendo os flex items crescer com flex-grow
    3. Agora fazendo eles diminuírem elegantemente com flex-shrink
    4. Definindo largura e altura de flex items com flex-basis
    5. Invertendo a ordem de renderização dos elementos