Frontend Mentor - QR code component solution ☺️

This is my solution to the QR code component challenge on Frontend Mentor.

Table of contents

• Overview
  • Screenshot
  • Links
• My process
  • Built with
  • What I learned
  • Useful resources
• Author

Overview

Screenshot

Links

• Solution URL: GitHub URL

My process

Built with

• Semantic HTML5 markup
• CSS custom properties
• Flexbox

What I learned

<main>
    <img src="images/image-qr-code.png" alt="QR-Code">
    <div id="text">
      <h2>Improve your front-end skills by building projects</h2>
      <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p>
    </div>
  </main>

Note: Don't put everything into divs, keep it as simple as you can

* {
  font-family: 'Outfit', sans-serif;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

Resseting all margins and paddings

Continued development

Goals

Keep working on other projects

Useful resources

• A guide to Flexbox - This website really helped me with flexbox and it was so simple.

Author

• Frontend Mentor - @jmjeshtri
• Twitter - @jori__mi