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 Master

@yunusemrecinar

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


Any feedback is welcome ;)

Community feedback

Lucas 👾 104,420

@correlucas

Posted

👾Yunus, congratulations for your new solution!

This is your best solution! You did pretty much everything here. You need only to replace the divs wrapping the rating section and the cards with semantic tags and fix the rating section mobile.

The section with the stars in the mobile version are too close to the text you can add gap: 16px to make some space:

@media (max-width: 1100px)
.row {
    gap: 16px;
    width: 338px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

👋 I hope this helps you and happy coding!

Marked as helpful

1

@yunusemrecinar

Posted

@correlucas What about now ?

0
Lucas 👾 104,420

@correlucas

Posted

@Yunuscinar41 much better 👏 the gap between the star and fhr text makes it more readable

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