Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive page using HTML + CSS

@Demils13

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


This is my first project of Frontend Mentor. Do not hesitate to give me some feedback.

Community feedback

P

@KrishnaVishwakarma1595

Posted

Hi, @Demils13

Your QR code image is not loading. For that, you can provide the src like this <img src="./images/image-qr-code.png" alt="QR Scan Code" />.

./ locates the current directory you are working on. Like @DundeeA said in his comment he misses the .. If you provide like that <img src='/images/image-qr-code.png' /> then also it won't load the image, cause it doesn't understands the path of file to locate.

  • We must always provide the alt="" attribute to the <img> tag. If it used for icons or non-describing images the we can keep the alt="" tag empty.

  • You should start using HTML Semantic Elements like <header>, <main>, <section>,<footer> etc. With these you'll understand the HTML Accessibility rules to keep.

I hope this will help you. Nice solutions. Good job. Congratulations on completing this challenge.

Happy Mentoring

Marked as helpful

2

@Demils13

Posted

@Demils13

HI Krishna,

Thank you for your feed back, I have a better understanding about my mistake.

2
Dun 290

@DundeeA

Posted

Good job completing this challenge, The QR code image isn't loading because the route you provided isn't correct.

The "src" in your img tag should be changed to this: <img src='./images/image-qr-code.png' />

This is because starting your image url with a "./ " is referring to the current folder, since the index.html and the "images" folder are in the same directory you just need the one "./".

Edited to correct "/" to "./"

Marked as helpful

0

@Demils13

Posted

@D'émilsD

Thanks, I correct my mistake.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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