Lembra quando o material design apareceu com seu label flutuante e todo mundo achou o máximo e muita gente comecou a implementar e gerar bibliotecas sobre isso?
Bem, vamos fazer isso só com css?
Nesse desafio você trabalhará com
- Seletores Irmão (
+
) - Pseudo Seletores (
:focus
,:placeholder
,:placeholder-shown
,:not
)
Só pode ser usado HTML e CSS
É necessaŕio que:
- Crie input com seus respectivos labels
- Quando um input tiver conteudo ou estiver com foco o label deverá flutuar para a parte superior do input
Você pode visualizar o modelo que eu fiz no CodePen