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

responsive notification panel

Kartik 20

@zZedx

Desktop design screenshot for the Notifications page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


idk why but some images are not showing up in live website

Community feedback

@asbhogal

Posted

Hi Kartik,

The reason why most of your pictures are showing is because of the / at the beginning of the src path. Remove these where they're present and your images will show.

Just a few other things:

  • Locally host your Google Fonts for privacy and performance reasons. Here's a good link explaining why and how to do this Link
  • Use clearer variable and class names, ie. "notification" instead of "noti", as this can make it harder for other developers to read (always code with a mindset of others reading it to work on or debug it)
  • Make sure to add an alt attribute for screen readers and other assistive technologies (this helps them to understand the purpose and context of images for accessibility)

Hope this helps!

Marked as helpful

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