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

Social proof section

@hajar-wa

Desktop design screenshot for the Social proof section 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 have used the JS in this project even it wasn't required, because I didn't like the fact you have to repeat the code multiple times while you can use basic JS and get similar results, the css was challenging because of that but I worked around it. and it turned out right, of course it could be better.

any feedbacks are welcome :)

Community feedback

Darkstar 1,000

@DarkstarXDD

Posted

  • There is no <header> in this design. <header> is for content that repeats across multiple pages in a website, like the brand logo and the navigation bar.
  • Everything in this design can be included in the <main>, not just the bottom part.
  • The site currently looks broken in mid size screens. Content are overflowing. You should avoid using fixed widths and heights for containers, there is no need to use min-width either.
  • Didn't you start mobile first when developing the page? If not try going through this article. It will give you a good idea.
  • The name and the verified status are not list items. They are just separate <p> elements. I think i gave you this feedback on a previous challenge too. You have to be careful what you use lists for.

Marked as helpful

1

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