Skip to content
Submitted 5 days ago

Product preview card using css and html

MarkoTintor23•40
@MarkoTintor23
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Product preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

This is my second small project, and it went smoother than the first. That I am most proud of.

What challenges did you encounter, and how did you overcome them?

Some css properties I googled and immediately found them.

What specific areas of your project would you like help with?

I need help particulary with my live site, why do my pictures never render in the website, but in the code and when I select "go live" in VSC it works well and all pictures are there, but when I go to the live site in GitHub it doesnt want to show pictures?

Community feedback

  • Øystein Håberg•11,010
    @Islandstone89Posted 5 days ago

    Hi. Your file path is incorrect. The path must be relative to the index.html. Change src="/product-preview-card-component-main/images/image-product-desktop.jpg" to src="images/image-product-desktop.jpg". NB: When you need different image versions depending on the screen size, use the <picture> element.

    Marked as helpful
    0
    MarkoTintor23•40
    @MarkoTintor23Posted 5 days ago

    @Islandstone89 That worked! thank you very much!

    1

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