@Agnik7
Posted
Hi, Congratulations on completing the challenge. I have some tips that might be of help to you.
-
You are using the relative path in the src of the
img
tag. You have mentioned the path as/qr-code-component-main/image-qr-code.png
. However, for any element present inside a secondary folder within the root folder, the path starts with./
. So, your correct path should be./qr-code-component-main/image-qr-code.png
. Always give an alt text, which specifies what to show if for any reason the image can't be displayed. Replace yourimg
tag with the following.<img src="./qr-code-component-main/image-qr-code.png" alt="QR code image" />
-
Replace the
h3
tag by theh1
tag. Always start from h1 and keep on decreasing one level. This will help prevent accessibility issues. -
Wrap the whole content in the body of the html inside
main
tag. To learn more about accessibility and semantic html, click here. -
In the index.html file, you are not using the
style
tag, so it's better to remove it. This helps you keep only the necessary lines of code. -
While centering in the body, instead of height, define the min-height for better responsiveness. You don't need to add
width:100%
since, 100% of the width is taken by default if nothing is mentioned. -
Define the max-width of the container, instead of the width to make it more responsive.
Hope this feedback helps you to improve in the future. Have a nice day!!
@tariqyunusa
Posted
@Agnik7 Thank You so much this was very helpful