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

Single price grid component using CSS Grid

@vencertorres

Desktop design screenshot for the Single price grid component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feedbacks and suggestions are welcome!

Community feedback

@MojtabaMosavi

Posted

1- A litle note about naming classes, it always a good practice to try to be descriptive and logical as possible which is not so easy all the time. In small project like this you can get aways with it but once you start working larger projects is should be something that you really put thought into.

    <section class="product__community></section>
    <section class="product__cta></section>
    <section class="product__features></section>

Keep coding :=)

Marked as helpful

0

@vencertorres

Posted

@MojtabaMosavi Thank you for pointing that out. Naming classes is one of the things that I've been trying to improve. BEM is something I'm looking into and I'm reading a lot about it.

0

@MojtabaMosavi

Posted

@vencertorres Your on right track.

0
P
AK 6,700

@skyv26

Posted

Hi! Vencer, You made it really good and responsive too. Just add margin at the both side of layout horizontally (in your media)

I checked design in mobile view so there is not enough space to separate layout from mobile viewport (I mean it look cool if have some space instead of sticks with mobile left and right handside scree)

I hope you understand.

Good Luck

Marked as helpful

0

@vencertorres

Posted

@skyv26 Thank you. I'll keep that in mind.

0

@aliabuhumra

Posted

This card is perfect

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