@stenito
Posted
Hi there, well done!
I would try to respect the sizes of the design, which is what you would have to do in a professional situation ;-)
On the report issues:
- Icon tag
The icon tag should have type="image/png"
and not type="png"
. A small thing but the browser uses type to know what type of file it is rendering. It might handle this small mistake, but you should not depend on the browser handling errors ;-).
- Semantic elements
A document should have a
<main>
tag. The<section>
tag can only be part of a<main>
tag it should not be used outside of it.
<main id="section">
<div class="QrCode">
<img src="image-qr-code.png" alt="frontendmentor">
</div>
<h2 class="firstpara center">Improve your front-end skills by building projects</h2>
<div class="secondpara center">Scan the QR code to visit Frontend Mentor and take your coding to the next level
</div>
</main>
If you want to code your component so you can use it afterwards, just add a <main>
element to your page to avoid the Accessibility (semantic) issues.
Marked as helpful