Design comparison
Solution retrospective
The Image is not visible in the Live-site. In my PC it was visible. I don't understand the problem. Can someone please explain it to me
Community feedback
- @Lo-DeckPosted over 1 year ago
Hi, well done for this challenge.
I've tried your Website and for the image I just wrote this :
<img src="./assets/images/icon-reaction.svg">
or<img src="assets/images/icon-memory.svg">
instead of<img src="/assets/images/icon-memory.svg">
.Do you see the point at the beginning or with no slash, try this and I think it will be working afterward.
Marked as helpful0 - @helenclxPosted over 1 year ago
Hi, the images are not visible in your live site because in your HTML, you set the images' relative paths as
/
, which represents the root directory, meaning when you deployed your files, the deployed site is trying to look for images located athttps://amaar09.github.io/assets/images/icon-reaction.svg
, ignoring yourResults-summary-component
folder.On the other hand, the images were visible in your PC might be because
Results-summary-component
is a root folder in your PC.To solve this issue, try changing the paths of your images to
./
, by adding a dot before the slash, which represents current working directory, for example./assets/images/icon-memory.svg
. This should make your deployed site look for the image files in yourResults-summary-component
folder.You can read more about HTML file paths here: HTML File Paths
Marked as helpful0
Please log in to post a comment
Log in with GitHubJoin 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