QR Code Component Challenge with HTML and CSS

Hello, congratulations on finishing the challenge.

With respect to your given it is always better to manipulate the content from the container, as you are doing, if you want to center it well you could use display:flex; and align-items:center; justify-content:center; with min-height:100vh; width:100%; this will center all the content and if you want the footer to be below you could do this:

.background { // card container
     flex-grow:1; // this will take up as much space as possible and push the footer
     /*other styles*/
}

I hope my contribution has been helpful.