Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Article Preview

@RamadaniRei

Desktop design screenshot for the Article preview component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@krushnasinnarkar

Posted

Hi @RamadaniRei,

Congratulations on successfully completing the challenge!

Your solution looks nice, though there are a couple of things you can improve, which I hope will be helpful:

  1. GitHub Pages Hosting: There is an issue with hosting your website on GitHub Pages because your HTML file is named artical.html. It should be named index.html so that GitHub Pages can recognize it properly.

  2. Image Paths: I downloaded your code and ran it on my PC. I noticed that you are using incorrect image paths. They should be relative to the location of your HTML file. For example, use ./images/your-img.jpg or images/your-img.jpg instead of /images/your-img.jpg.

  3. Component Stretching: Your component gets stretched as the screen size increases. To address this, you should set a maximum width for .previewContainer to prevent it from stretching too much.

I hope you find these suggestions helpful.

Feel free to reach out if you have more questions or need further assistance.

Happy coding!

0

Please log in to post a comment

Log in with GitHub
Discord logo

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