simply card layout

Greetings, Yuenu! 👋

Congratulations on finishing this challenge! 🎉

I have some feedback on this solution:

• Accessibility
  • Good job on using main landmark! 👍
  • For your attribution, you wrap it with footer.
  • For any decorative images, each img tag should have empty alt="" and aria-hidden="true" attributes to make all web assistive technologies such as screen reader ignore those images. In this case, all images are decorative only.
  • The Learn More buttons should be links because if this is a real website, those buttons will navigate the user to another webpage.
  • FYI, anchor tags are for navigation - moving to different pages or content on the same screen, while the button elements are for actions like opening a modal, submitting a form, toggling element, etc.
  • Next time, if you are using button element, always specify the type of the button. By doing that, you prevent the button from behaving unexpectedly.
• Styling
  • Currently the headings have a different font family from the design. Even though on design comparison you have used the correct font family.
• Best Practice (Recommended)
  • I would recommend reducing the indentation of your code because right now it's hard to read your code. Usually, 2 - 4 spaces should be enough.

Overall, your solution looks good on my mobile view (both landscape and portrait) and desktop view. Good job! 👍

That's it! Hopefully, this is helpful! 😁

Hay ! Good Job yuenu

These below mentioned tricks will help you remove any Accessibility Issues

-> Add Main tag after body like it should be your container. For 1st heading or h1 tag, use header tag and then inside the header put your h1 or h2 etc . But use header tag only once in main heading element.

Keep up the good work!