Front-end

Flexbox: Posicione elementos na tela

Curso online de Flexbox: Posicione elementos na tela

1223 9.5

9,5

é a nota desse curso

3.750

alunos neste curso

Faça esse curso e...

  • Aprenda a famosa especificação flexible box para posicionar seus elementos na página
  • Entenda as diversas propriedades do flexbox e como usá-las
  • Entenda como as propriedades do flexbox substituem float, inline e inline-block
  • Elabore um site responsivo com flexbox

Veja a 1ª aula

Público alvo

Desenvolvedor front-end com experiência em HTML e CSS e que já tenha sofrido com posicionamento de elementos na página

Nível de Dificuldade

Intermediário

Instrutores

  • Yuri Padilha

    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).

Já é aluno?

Começar o Curso

Conteúdo Detalhado

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

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

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

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

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

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

Escolha o seu plano e vamos começar

  • Cursos
  • Certificado de participação
  • Todas as formações
  • Projeto avaliado pelos instrutores
  • Certificado de avaliação
  • Acesso à Alura Start
  • Acesso à Alura Língua
  • Preços
  • Como Funciona?
Premium
  • 598
12X R$75 à vista R$900
Comprar
Premium Plus
  • 598
12X R$100 à vista R$1.200
Comprar
Max
  • 598
12X R$120 à vista R$1.440
Comprar
Acesso por 1 ano
Certificado Digital de conclusão
Estude 24h/dia onde e quando quiser
Novos cursos toda semana