QR code component solution using CSS Grid and Flexbox
Design comparison
Solution retrospective
1- Please help. My finished project is not displaying correctly from the github live site url above! At first I forgot to include the image file in my file uploads but later added it in the github. I tried to refresh the page but did not work even though the finished project is now displaying correctly in my laptop after updating the file path in the 'src' attribute in the source code.
2- I am getting the following errors and whenever I try "git add ." in Git Bash. So I couldn't add, commit and push my codes from local machine to git hub. I had to resort to manual method! I have the following file types in my folder: .png, .gitignore, .html, .md and .css
warning: in the working copy of '.gitignore', LF will be replaced by CRLF the next time Git touches it error: unable to write file .git/objects/d1/3464af54e87679bf87e20754a35abe51dc4449: Filename too long error: .gitignore: failed to insert into database error: unable to index file '.gitignore' fatal: adding files failed
Now questions related to the project
1- I find it difficult to control the size of the image in its container using only template-columns and template-rows properties in grid without specifying image size in any unit. Please how best should I do it?
2- Please what is the difference between section, article and aside semantic tags in html?
Community feedback
- @michaelbulaongdevPosted about 2 years ago
Hi,
Looking at your repository, the image file is located in your root folder. However, in your index.html, it is still routing from the "images" folder.
<img src="./images/image-qr-code.png">Either add an "images" folder in your repository root then move the image file into that folder, or edit the <img src=""> in your index.html in order to fetch the image file from the correct address.
Then re-run the build to deploy changes in your live site.
I hope this feedback helps.
Happy coding! :)
Marked as helpful0@Aliyu-SaiduPosted about 2 years ago@michaelbulaongmusic Thanks a lot. The image is now displaying correctly!
0
Please log in to post a comment
Log in with GitHub
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