Single Price Grid Component Challenge

Community feedback

• 

  romila•3,570

  @romila2003Posted about 2 years ago

  Hi Veronica,

  Congratulations 🎉 for completing this challenge, the grid component looks great and is responsive however I found some issues I want to address:

  1. Your button is missing the type attribute e.g. <button type="button" class="btn"></button>
  2. To make your button feel more like a button, you should give it the cursor property e.g. cursor: pointer;
  3. Regarding your question, you should set the font-family property for the button to inherit and for your box-shadow, it does work however the value of it and the color is to light to show e.g.

  button {
    font-family: inherit;
    box-shadow: 10px 10px 20px hsl(218deg 9% 41% / 30%);
  }
  

  The value I gave was just an example so feel free to change it to your choice.

  Overall, great attempt and wish you the best for your future projects so keep coding 👍.

  Marked as helpful

  0
• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾Hello Veronica, congratulations for your new solution!

  🎯 Your solution its almost done and I’ve some tips to help you to improve it:

  You made your html structure entirely with div blocks but these div doesn't any semantic meaning, for this reason is better you use a better html markup improving your code, for example for each card you use <article> instead of the <div>.

  This article from Freecodecamp explains the main HTML semantic TAGS: https://www.freecodecamp.org/news/semantic-html5-elements/

  The heading should follow the sequence, so you cannot jump from h1 to h3, follow the sequence of hierarchy as h1, h2, h3…

  ✌️ I hope this helps you and happy coding!

  0
• 

  Ahmed Kamel•1,190

  @hmadamkPosted about 2 years ago

  don't add heading to choose you font size heading indicate how much nested the section is choose the right heading add change the font later other than that great job

  0