Skip to content
Submitted over 1 year ago

Simple CSS QR-code component

Pamella Oliveira Conte•100
@Pamellaoliveiraconte
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)
Code

Please log in to post a comment

Log in

Community feedback

  • Renan Rodrigues•940
    @irenanrodrigues

    Oi @Pamellaoliveiraconte, tudo bem? Parabéns pela solução, conseguiu reproduzir bem o desafio. Se você aceitar, tenho algumas dicas, que você pode usar no seu código.

    Vi que você teve problemas para centralizar seu card, com o flexbox. Isso aconteceu porque você usou na sua classe .container, o certo era você usar na tag body.

    No .container, remova o margin e height. Adicione apenas um padding: 20px;

    Recomendo você remover a div.card, você configurou duas vezes a imagem do qrcode, apenas deixe a configuração que você usou para sua tag img.

    Tente começa a desenvolver usando tags semânticas, como <main>, assim você melhorar a acessibilidade e a organização da sua página.

    Marked as helpful
  • Cristian Melo•50
    @cristianmeelo

    Oi Pamella, vi que tu terminou o desafio. Ficou muito bom! Podia me contar uma pouco da tua escolha em usar um h2 ao invés de um h4 ou h6?

    Senti falta da tag main dentro body, talvez semanticamente,

    <div class="container"> essa div poderia ser main ?
    Marked as helpful
  • P
    Surya Prakash Singh•170
    @suryathink

    Hi Pamella Oliveira Conte,

    Your deployed site looks exactly the same as the Screenshot.

    Great job with your code.

    Happy Coding!

    Marked as helpful

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord