Este codelab prepara você para compartilhar e mostrar sua maneira favorita de centralizar CSS.
Confira minha postagem do blog Centralização em CSS para saber mais sobre cinco das minhas formas favoritas de centralizar o CSS. Ou assista a este vídeo!
Configuração
- Clique em Remixar para editar para tornar o projeto editável.
- Abrir
app/index.html
- Em
line 23
, substitua/* your centering CSS here /*
pelo seu CSS - (opcional) Nomeie sua técnica de centralização e substitua o texto na
<h1>
Estilos
- Crie um novo arquivo na pasta
app/css/
. - Crie um seletor para armazenar sua solução de centralização, como
.turbo-center
ou[floaty-mcfloat]
- Com esse novo seletor, escreva sua técnica de centralização (fique à vontade para olhar
um de outro em
app/css/
, por exemplo) - (opcional) escreva alguns "estilos de suporte" para saber quais crianças precisam para dar suporte à centralização
- Abra
app/css/index.css
e importe o novo arquivo na parte inferior
Vincule tudo
- Abrir
app/index.html
novamente - Encontre o
<article>
e insira o seletor personalizado que você fez na etapa 2 do na seção anterior. - Envie um tweet sobre seu Glitch para que eu a apresente a postagem do blog.