Qr project!!

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  Fala Lucas, meu xará. Tudo bem? Parabéns pelo seu primeiro desafio!

  Dei uma olhada no seu código e tenho umas dicas pra você!

  O seu componente do qrcode tá quase pronto, mas eu queria te deixar umas dicas pra você alinhar ele usando flexbox que é o metodo mais fácil de todos.

  A primeira coisa que você tem que fazer é adicionar algumas propriedades pro body, primeiro adicionamos display: flex e flex-direction: column pra alinhar tudo na vertical. Depois adicione min-height: 100vh (isso vai fazer com que o body tenha 100% da tela como tamanho) e com isso o elemento filho (no caso o container) vai se alinhar ao tamanho dele, no caso 100% da tela, dessa forma ele ficará centralizado, entendeu?

  Continue no foco!

  Marked as helpful

  0

  ---

  

  Lucas Matheus•400

  @LukiticasPosted over 2 years ago

  @correlucas Obrigadoo Luquinhas!! Adorei o feedback!!

  Quanto ao body, alguns colegas meus me instruíram a evitar estilizar ele diretamente, por isso que o componente do qr code está dentro de um main, e esse sim eu apliquei as estilizações, e invés de flexbox eu usei algumas propriedades que aprendi recentemente:

  display: grid;
  place-item: center;
  

  Para posicionar o card no centro. Será que eu posso estilizar a tag body normalmente?

  0

  

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  @Lukiticas O body geralmente eu usó pra alinhar os elementos que estão dentro dele e colocar o background. Do jeito que vc fez pra alinhar com o grid funciona tbm e é até melhor pq requer menos linhas de código.

  Estiliza só o basico no body e as outras coisas voce aplica no container.

  0