Skip to content
Submitted over 2 years ago

Useful Way to use (grid) HTML & CSS

Ahmed_J_FrDev•30
@ahmedJabban
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Product preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

I did not find any difficulty and that makes me more confident, But.....: I just want you to tell me if there is any problem with my code?, or if you notice that my code is complex (Not easy to understand its logic)?.

Community feedback

  • Jose Gonzalez•310
    @placetenoPosted over 2 years ago

    Hi @ahmedJabban,

    I was looking at your solution and it looks good in desktop view! However, there's a small error in your media query that prevents the card to switch to mobile view. You wrote @media (width:375px) but inside the parenthesis it should be (max-width: 375px). That should fix the responsiveness issue.

    Also, I noticed in your CSS that you used the class .containor all the time when writing the rules for the other classes. This is not necessary because there's no overlap. If you had two, let's say, .price classes in two different containers, then it would make sense to specify which price, but that's not the case here.

    I hope this is useful! And keep going! 😃

    Marked as helpful
    1
    Ahmed_J_FrDev•30
    @ahmedJabbanPosted over 2 years ago

    @placeteno Thank you so much for your notes, I will fix the error now!.

    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