QR code Component

Congratulations on finishing your first project, Abhay!

If you want the card to be centered both vertically and horizontally I don't recommend using a margin, there are easier ways. In this case remove the margin from the card and add to the body the following:

body {

   display: flex;
   justify-content: center;
   align-items: center;
   min-height: 100vh;

}

This way it will be centered for all screen types.

By the way modify .<link rel='shortcut icon' sizes='32*32' href='images/favicon-32x32.png' type='image/x-icon'> to <link rel="icon" type="image/png" sizes="32x32" href="./images/favicon-32x32.png"> to remove the error from your report.

By the way the title is not black, it has the following color color: rgb(31, 50, 81) I would recommend you to change it.

Finally, I recommend you always look at the frontend mentor reports, they will help you not to make mistakes in the HTML and accessibility, you could change the <div class="wrapper"> to <main class="wrapper"> the main reason for this change is because you should always have a <main> inside the body that occupies the main content of the project.

After making these changes you should have 0 errors and the project should finish quite well.