Frontend Mentor QR-code Challenge

Hey @ucolinmee well done for completing this challenge 😄

I will try to answer your questions:

• Centering an Image in a Div: You're on the right track by looking for a better way to center an image within a div. Instead of manually calculating padding values, you can use CSS Flexbox or Grid. For Flexbox, you could set the parent div's display property to flex and use justify-content: center; and align-items: center;. For Grid, you can set the parent div's display property to grid and use place-items: center;.

• Font and Color Codes: If you're curious about the fonts and colors used in a webpage, you can use browser developer tools. Right-click on an element and select "Inspect" or "Inspect Element" to open the dev tools. There, you can explore the CSS applied to different elements, including fonts and colors. You can also use browser extensions like "WhatFont" to identify fonts and color picker extensions to get color codes.

I hope you'll find this helpful😄

For 2 you can use the provided figma files (not sure about sketch). Figma has added a developer view so you can inspect the css. The style guide has the font details.

center a image in a div :

justify-content : center; align-items: center;