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

Blog Preview card

@tshegofatso-motlhakane

Desktop design screenshot for the Blog preview card coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

I did the most bruh

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

I was able to make everything fit

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

Colors and shadows

Community feedback

William 40

@Dartheryon

Posted

Hi! I think it was a nice job, mate :D I have some improvement notes for you. the size of elements like the badge and heading text are quite different from the ones on the design. Keep an eye on it :)

regarding your code, I see the image is not rendering on your solution. This happened because in your index.html line 30 you define the route to the image in a wrong way. if you want to use relative paths, in this case you do need a leading dot, before the « / » Besides, you should always use an alternative text for your images. your code:

<img src="/assets/images/image-avatar.webp" alt="">

my suggestion:

<img src="./assets/images/image-avatar.webp" alt="creator avatar">

Accesibility is something important, that many of us leave unattended. I want to change that on myself and it would be nice if you commit to do it as well. :)

Keep moving forward dude!! :D
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