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

HTML CSS Grid Flexbox (Mobile First)

Priya Garg 200

@Priya366

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


Hello!! This challenge has some parts which were kind of new to me.

I have tried for the first time mobile first approach and I kind of liked that because this approach increases my speed and also less code.

I tried to make it look possibly similar to designs that were given. However, I was kind of get struck in those three testimonials part. I tried to move them down by using margin but it does not went well. Please drop a feedback about "How to move those violet bg-color columns down as shown in design". I will appreciate them. Thank You!

Community feedback

Yonathan 370

@yonathan-palma

Posted

Greetings priya excellent work with your CSS code take some tips,

The way to move the columns is to align each one individually with "align-self" or "justify-self" it works similarly to "align-content" or "justify-content" but it is applied directly to the items I invite you to investigate it.

1

Priya Garg 200

@Priya366

Posted

@yonathan-palma Thank You buddy!! It works well. Now, the design looks good. Thanks once again!!

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