Interactive Rating Component using HTML, CSS (Sass) and Javascript
Design comparison
Solution retrospective
I cannot for the life of me get the image on the thank you state to load. I'm using a template literal to generate the HTML for it, and it works locally, so I don't know what the issue is at all.
I really struggle with refactoring my code. I wanted to make the site as easy to navigate with keyboard as possible, but it made it very difficult to code, and so it's kind of a mess. If anyone has advice on refactoring I would really appreciate it.
Community feedback
- @davislocsPosted over 1 year ago
Hey. Im not 100% sure about this, but try uncomment this part of HTML code and image should show up.
<div class="container thanks-state"> <img class="thanks-image" src="/images/illustration-thank-you.svg"> <p class="selected">You selected Add rating here out of 5</p> <h1>Thank you!</h1> <p> We appreciate you taking the time to give a rating. If you ever need more support, don't hesitate to get in touch! </p> </div>
If you found this helpful mark it as such :)
0@llKryptonixllPosted over 1 year agoI tried to remove the "/" at the image src path and this worked
0@taco-nekoPosted over 1 year ago@davislocs Hi, no... I am using Javascript to generate the HTML. Uncommenting that code will make a second box, which is not what I want.
0@taco-nekoPosted over 1 year ago@llKryptonixll I have tried every form of the file path, with no
/
, with ``/, with./
, nothing has worked :/ It's only in the generated html, the one that's there by default in the file doesn't have any file path issues.EDIT: got it working with
./
. pro tip, change the url to these things in the browser's inpector so you don't have to push it again and again.0
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