Skip to content
Submitted over 2 years ago

Social proof section master

Andreea Angelescu•120
@AngAnda
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've used HTML and SCSS to build this project. I would appreciate any feedback on my code and suggestions about what I could to in order to make it more efficient and readable.

Concerning the semantic of HTML I don't know if using an article for the purple card components was a good choice but I couldn't think of any other alternative aside from a plain div. Also, for the five stars rating cards I've used an aside to encapsulate all the card components.

In this project I've tried to follow the BEM standards for naming classes.

Community feedback

  • Lucas 👾•104,400
    @correlucasPosted over 2 years ago

    👾Hello Andrea, congratulations for your solution!

    The solution design elements are really good done and the all elements are responsive, this is really nice, I liked the media query you've add to change the content flow a bit before mobile.

    The only thing I think you can change, is the background-size to cover or contain in the body, I saw that you've used a shorthand for the background, but this goes out.

    About semantics you did a good work using main and article isn't everyone that pay attention to these details, for the paragraph with the quote you can use <blockquote> instead of p, to have the perfect tag.

    Andrea! The rest is just perfect, congrats!

    Marked as helpful
    1

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