Submitted 2 months ago

QR Code Box

DanielJamesPM•30

@Danieljamespm

Preview site View code

This is a solution for...QR code component

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

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

Centering everything. To center the box itself I used margin: auto;. To center the image and text inside I used flex at first but realized I just needed text-align: center;.

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

Getting the HTML and Body to take up the whole space of the page. I assumed they would fit the container automatically.

html{ min-height: 100%; margin: 0;

}

body{ min-height: 100vh; margin: 0; background-color: var(--slate-3); }

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

I am hoping my solution isn't too much and could have been accomplished with way less code.

Community feedback

LuccaMauroMolina•130
@LuccaMauroMolinaPosted about 2 months ago
esta bueno, fijate que en el responsive no se ajusta muy bien, en algunas partes se cortan, pero en general esta bastante bien el codigo
0
capiste•40
@capistePosted about 2 months ago
Good Job on your work! It looks great.

Just some key points to take note of. Make sure to double-check the view of the website on both desktop and mobile view to see if the web elements fit into the view. I did a quick check of your sample code using the mobile view and some parts were cut off. But aside from that, everything else looks good to me. Great work once again!
0

Please log in to post a comment

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