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

@CFlores9812

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


if i can get some feedback on my code and how to improve it please.

Community feedback

P
tediko 6,530

@tediko

Posted

Hello, Carlos Flores! 👋

Congratulations on finishing another challenge! Your solution responds quite well and looks nice. What I can suggest is:

  • .col-1, .col-2, .col-3 content font-sizes are too big on desktop and also on mobile resolutions. Additionally, each of these classes has the same code, so to avoid repeating it, use only one class with this code.
  • font-sizes on mobile resolutions are too big.
  • I believe you forgot about background images.
  • Below 885 width device your .reviews boxes overflow site width and scrollX appear. Try to wrap your whole content with some container and set margins on it.
  • You repeat your HTML code with stars images which is unnecessary. Find the way to use only one star image for a .reviews etc. You can do it easily by using ` approach in your css.

This is my approach to this challenge LINK. Like most people here, I also learn but maybe you will find something good for yourself.

Good luck with that, have fun coding! 💪

1
Tiass 295

@Tiasstiass

Posted

Good job! Seems like you forgot to add the background images, also some padding, margin and sizing issues to make it perfect. Keep up the good work! 💪

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