Skip to content
Submitted over 1 year ago

Social proof usando flexbox y grid

Gerardominic•80
@Gerardominic
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Social proof section
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I have made my solution, using html and css, with flexbox and grid, it was a little difficult for me in the case of the 5-star container and the testimonials so that they are arranged according to the image

Community feedback

  • Victoria Azola Silva•1,290
    @VickyAzolaPosted over 1 year ago

    hi, awesome job! At the beginning I encountered the same problem with the stars icon, my first solution was to just put 5 times the icon, but there is a better approach, to improve my code i used css backgroun propertys:

    background-image: url(images/icon-star.svg);
background-size: 18px;
background-repeat: space no-repeat;
width: 6.4rem;
overflow: hidden;

    also use grid and flex to position in the right place. Hope this helps!

    Marked as helpful
    0

Please log in to post a comment

Log in with GitHub

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