Single Price Grid Component

Community feedback

• 

  Okafor Raphael•240

  @OkaforRaphPosted over 2 years ago

  Hey Martinez, congratulations on completing the challenge! You did a great job 😉.. Yo also have a comprehensive knowledge of flexbox which is really nice.

  Let me give you some little tips and answer your question:

  1st .cards { margin-top: 2rem; display: grid; grid-template-columns: 1fr 1fr; max-width: 40rem; margin: 1rem;

  }

  2nd

  .card_two { grid-column: 1/-1; This will span it to fill the first column and push the other two down }

  If you have any further questions, you can ask, and i will answer Hope this helps! Happy coding 😁

  Marked as helpful

  1

  ---

  

  Óscar Rabadán Martínez•150

  @OscarandioPosted over 2 years ago

  @OkaforRaph Thanks for your words and answer my question! If can I ask what is exactly the "grid-template-columns: 1fr 1fr" doing? Is that the separation in two colums? Then let's say if I want three columns the code would be 1fr 1fr 1fr? Sorry for my ignorance of how Grid Templates works.

  0

  

  Okafor Raphael•240

  @OkaforRaphPosted over 2 years ago

  @Oscarandio Yes👍... That is how grids work.... If you have time, I would refer you to watch Kelvin Powell's YouTube videos of CSS Grids

  Marked as helpful

  1