Submitted 3 months ago

Making First QR Scanner Webpage Using CSS And HTML

ankushPana• 40

@ankushPana

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

QR code component

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Community feedback

Hexerse• 460

@Hexerse

Posted 3 months ago

For my body I used 100vh height, so that display flex, justify content and align-items are at the center.

height: 100vh; display: flex; justify-content: center; align-items: center; flex-direction: row;

Don't forget to add border radius to the qr code

U can add <br> to shape how u want ur text to look too. I did this.

<h2>Improve your front-end <br> skills by building projects</h2> <p>Scan the QR code to visit Frontend <br> Mentor and take your coding skills to <br> the next level</p>

TrungHau• 10

@23020061

Posted 3 months ago

too large

Max• 160

@maxkdavis

Posted 3 months ago

HTML & CSS

Use the a header element (<h1>) to improve your html semantics.
Size of the component can be changed using the max-width css class. This will help ensure the size of your component matches the design.
Make your code more readable for other users. Removing spacing between lines 35 and 44.

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