Submitted about 1 month ago

Problem-Solving with figma, Git/GitHub, Spck editor, & Screenfly

Ese Odiase•150

@eseodiase

A solution to the QR code component challenge

Preview Code

Solution retrospective

What are you most proud of, and what would you do differently next time?

Next time I will test my live url on multiple devices before deciding if I should include media query on my CSS or not.

What challenges did you encounter, and how did you overcome them?

Working with figma for the first time was an interesting challenge. I had to navigate between multiple browsers before I was able to open the .fig file.

What specific areas of your project would you like help with?

None at the moment.

Code

Please log in to post a comment

Community feedback

Mustafa Sen•3,120
@mustafasen97
Posted about 1 month ago
Your design is nice and I can say that your codes are generally good.

You can open the console in your browser to test your design on different devices. When you right click on the page, you will see an option like 'Inspect'.

After opening the console, click on the computer and tablet icon on the top left (Change Device toolbar) and you will see many devices. Here you can test by selecting different devices from the Dimensions section at the top.

However, make sure that the zoom in the top bar is 100% during the test. Also, to center your design exactly, just add the following codes to the "main" section.
```
display: flex;
align-items: center;
justify-content: center;
```
P
MoonBeam Studio•90
@MoonBeam-Studio
Posted about 1 month ago
The CSS is really readable and easy to understand

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