Skip to content
OverviewSolutions
7
Comments
8
abdurohman seid
@abdu36-png

All comments

  • abdurohman seid•140
    @abdu36-png

    Good work ,berta you are from ethiopia like me

  • Ivan Deshchenko•40
    @mrfrend
    What are you most proud of, and what would you do differently next time?

    I guess I'm proud I did that, even so I still have some confusion about Grid.

    What challenges did you encounter, and how did you overcome them?

    I didn't know ho to visually hide a heading. Just googled it.

    What specific areas of your project would you like help with?

    When should I explicitly tell sizes of my content inside grid container? What and how that will affect my work?

    HTML and CSS

    1
    abdurohman seid•140
    @abdu36-png

    Hello there 👋. Good job on completing the challenge ! I have some suggestions about your code that might interest you. -use smaller widths in cards. I hope you find it useful! 😄 the solution you submitted is great! Happy coding!

    Marked as helpful
  • abdurohman seid•140
    @abdu36-png

    Good work

    Marked as helpful
  • abdurohman seid•140
    @abdu36-png

    your work is good! using table for your final section.

  • abdurohman seid•140
    @abdu36-png

    Hello there 👋. Good job on completing the challenge ! I have some suggestions about your code that might interest you. -when you use font-weight use it form 'style-md'. -make the size of the image 80px:80px. I hope you find it useful! 😄 Above all, the solution you submitted is great! Happy coding!

    Marked as helpful
  • abdurohman seid•140
    @abdu36-png

    It is good

  • WesleySCunha•40
    @WesleySampaioCunha
    What are you most proud of, and what would you do differently next time?

    Fazer projeto, que me insipira ainda mais a ser um Desenvolvedor Front-end

    What specific areas of your project would you like help with? <!DOCTYPE html> <html lang="pt-br"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="css/componentedecodigoqr.css"> <link rel="shortcut icon" href="img/favicon-32x32.png" type="image/x-icon"> <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap" rel="stylesheet"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap" rel="stylesheet"> <style> @charset "UTF-8";

    body{ margin: 0; padding: 0; background-color: #6DA0F2; font-family: Arial, Helvetica, sans-serif; }

    div.container { background-color: white; margin: 50px; margin-left: 500px; height: 450px; width: 300px; padding: 20px; align-items: center; text-align: center; border-radius: 25px; }

    img { height: 50vh; border-radius: 10px; }

    span#primeira-frase > p { font-family: "Outfit", sans-serif; font-weight: bold; }

    span#segunda-frase > p { font-family: "Outfit", sans-serif; } </style> <title>Componente de código QR</title>

    </head> <body> <div class="container"> <div id="quadrado"> <img src="img/image-qr-code.png" alt="" id=""> 
                <span id="primeira-frase">
                <p>
                    Melhore suas habilidades de Front-End construindo projetos 
                </p>
            </span>

            <span id="segunda-frase">
                <p>
                    Escaneie o código QR para visitar o Frontend Mentor e levar suas habilidades de codificação para o próximo nível
                </p>
            </span>

        </div>
</div>
    </body> </html>

    compeonete_de_codigo_QR

    #pure-css
    1
    abdurohman seid•140
    @abdu36-png

    your work is good but please use CSS flexbox,it is your main mistake

  • abdurohman seid•140
    @abdu36-png

    Hi NICKSON S your work is good but you should centering the component vertically,by using displaying flex and align-items center.