Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Used CSS grid to center items

nimbul30 110

@nimbul30

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I was struggling with how to center the entire container within the body.

Community feedback

@florent6001

Posted

Hi @nimbul30,

Look like you didn't change the default font of your project. In the Style Guidelines files you got a font that you can import to your HTML code via Google Font (of course, you have to change your font-family in your CSS file.)

Here is a tutorial to import the google font : https://www.w3docs.com/snippets/css/how-to-import-google-fonts-in-css-file.html#:~:text=Open%20Google%20Fonts%20and%20follow,(in%20HTML%20or%20CSS).

Well done for the rest, have a nice day.

Marked as helpful

0

@VCarames

Posted

To fix the centering, since you're using grid for your body, you can add place-items: center and min-height: 100vh and that will fix that.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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