Responsive Card using CSS flexbox

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  Hello Esteban, congratulations for you solution!

  Overall your solution design seems really good! The only thing you can do to improve it is fix the ACCESSIBILITY ISSUES that you can take a look in the report panel.

  You've 3 accessibility issues, you can fix all of them doing that:

  • You need ever to apply one H1 heading, in your code you started by H2 and put the main headline inside a <div> tag.

  • You need to wrap the most important content inside the <main> tag, to show hierarchy to your html structure, so you can change your .container div to <main class="container"> to avoid this problem.

  I hope it helps you to fix your solution report!

  Marked as helpful

  1

  ---

  

  P

  Esteban•670

  @evertznerPosted over 2 years ago

  @correlucas Thank you very much, I will take a look since I omit those accessibility issues.

  1
• 

  mubizzy•1,520

  @mubizzyPosted over 2 years ago

  Excellent job on this challenge!

  Hope it helps:)...don't forget to mark it as helpful 👍

  1
• 

  Chris Andrews•170

  @ChrisAndrewsDevPosted over 2 years ago

  Hey Esteban!

  Your solution is really solid, but as Lucas mentioned, you have a couple of accessibility issues (they are really easy to fix, Lucas explains how in his response! ^.^)

  As far as the design goes, there's only a couple of small differences I can spot (I am fairly new to coding so if anyone else can correct me that would be great!)

  -The price font weight is slightly heavier on the prices elements in the design brief, from memory it's font-weight 700 -Same goes for the button element text

  Your responsiveness is spot-on, much better than my attempt >.< !

  Nice job!

  1

  ---

  

  P

  Esteban•670

  @evertznerPosted over 2 years ago

  @ChrisAndrewsDev thank you for your contribution. Without figma files it is a bit difficult to tie the design, hehe. I

  1