Skip to content
Submitted about 1 year ago

QR HTML, PADDING, MARGIN

Randal-eng•20
@Randal-eng
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Any comments that contribute to my learning are welcome.

Community feedback

  • Brendan•1,120
    @OneManBannedPosted about 1 year ago

    Hi Randall a nice looking solution.

    I only have a few suggestions.

    • You should change the <h3> to a <h1>. All pages need a <h1> heading element. The usage notes section on the mdn headings page explains why. Here is the link

    • I would also change the .main-qr div into a <main> element. The <main> HTML element represents the dominant content of the <body> of a document.

    • In your css I would suggest you avoid adding fixed width and height declarations and use min-width - max-width instead. This can make your page a lot more flexible to different screen sizes. Same goes for using pixels. It would be better to use relative units like % and rem.

    I hope you find that helpful.

    Good work.

    0

Please log in to post a comment

Log in with GitHub

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