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

Bingerminn 240

@yallsobad

Desktop design screenshot for the Social proof section coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@alosoft

Posted

@yallsobad Your cards container does not align with the other content on the page. You need to remove the margins from the review elements. Try this:

.review{
    background-color: var(--Very-Dark-Magenta);
    color: var(--White);
    height: 230px;
    /* margin: 1rem; */
    padding: 1.5rem;
    border-radius: 0.5rem;
}

Then add a gap to the bottom element

.bottom{
    gap: 1rem;
}

You also did not make it responsive. There is no mobile version

Marked as helpful

0

Bingerminn 240

@yallsobad

Posted

@alosoft Thank you! Great tip!

The mobile version kicks in @ 375px per the design, but it looks like I should use 425px for that from now.

Appreciate the feedback!

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