QR Code Challenge using HTML and CSS

Hello, great job.

Regarding the first question, the HTML <main> Tag is used to give the main information of a document. The content inside the <main> element should be unique for the document. Which includes the sidebars, navigation links, copyright information, site logos, and search forms. The footer tag is important because A <footer> element typically contains:

• authorship information
• copyright information
• contact information
• sitemap
• back to top links
• related documents.

In conclusion, these tags are always needed even with small codes.

Secondly, h1 tags should be placed near beginning of pages and there should be a single h1 tag per page so they help search engines understand the page, improve user experience and improve accessibility

Lastly, HTML's font size is the root font size, which means it will be used as a base for rem calculation, but that's it, nothing else. It shouldn't be used for real text size calculation: it's just a kind of trick for some browsers.

• Body's font size is the text's default font size: all your text should have this size unless overriding the definition
• Special elements should have sizes in rem, with a fallback in pixels So that is how it looks in CSS:

html {
    font-size: 100% /* or 62.5% or whatever you like, it doesn't matter, it's just a browser fix, however "rem" units will be based on that value, so make it confortable for calculations */
}

body {
    font-size: 0.75em; /* That is your text's default font size. Here i chose 12px */
}

h1 { /* or whatever element you want to change the font size of */
    font-size: 20px; /* for browsers that don't understand the "rem" unit */
    font-size: 1.25rem; /* which equals to 20px if html's font-size was set to 100% */
}