Submitted almost 2 years ago

QR Code Component Challenge with HTML and CSS

@AlixiaDae

A solution to the QR code component challenge

Solution retrospective

I always have such difficulty centering my content. I feel like there must be an easier or cleaner way of doing this. I'll have to read others' CSS regarding best practices. If anyone has any tips, I'd love to hear about it!

Code

Please log in to post a comment

Community feedback

Luis Jimenez•760
@LuisJimenez19
Posted almost 2 years ago
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.

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