Responsive 3 column card using flexbox

Community feedback

• 

  Ahmed Bayoumi•6,740

  @Bayoumi-devPosted over 2 years ago

  Hey Nervous, It looks great!... Here are some suggestions:

  • Document should have one main landmark, Contain the component with <main>.

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

  • Using more than one <h1> is allowed by the HTML specification, but is not considered a best practice. Using only one <h1> is beneficial for screenreader users.

  ---> Multiple <h1> elements on one page

  • Use <button> or <a> instead of <div class="button">Learn More</div>.... Buttons are used for actions like opening or closing something or sending a form, Links are used for navigation and actions, So in this case, I suggest you use the anchor link <a> and then add this attribute ---> role="button"

  <a href="#" class="button" role="button">Learn More</a>
  

  Hope this help!... Keep coding👍

  Marked as helpful

  1

  ---

  

  Nervous Buffalo•350

  @mathieuc22Posted over 2 years ago

  @Bayoumi-dev thank you!

  I replaced card div by main, use sections to allow multiple h1 and use button instead of div now.

  0