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

Nika 240

@Nikkakko

Desktop design screenshot for the Single price grid component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@adityas24

Posted

Hey Nika! good job with this one.

On small screens (below 600px) your card has no space around it. You card needs some left and right margin around it. We do not set that margin on container as margin on container is set to auto to center the card. So best way of doing this is that always wrap the container inside some element and give margin to that element, that can be section or div according to your requirement.

Here is the code

<div class = "card> 
   <div class = "container">
      .
      .
      .
   </div> 
</div>

.card {
  margin: 0 2rem;
}

Hope it helps. All the best 🙂👍

Marked as helpful

0

Nika 240

@Nikkakko

Posted

@adityas24 thanks for feedback.

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