Three colum preview card responsive

Community feedback

• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted almost 2 years ago

  Hello there 👋. Good job on completing the challenge !

  I have some suggestions about your code that might interest you.

  HTML 📄:

  • Use the <footer> tag to wrap the footer of the page instead of the <div class="attribution">. The <footer> element contains information about the author of the page, the copyright, and other legal information.

  • You should use the <a> tag instead of the <button> tag because the Learn More button is a link to another page. Use buttons to perform actions like submitting a form or closing a modal and use links to navigate to another page. You can read more about this here 📘.

  • Not all images should have alt text. Car icons are for decoration purposes only, so they can be hidden from screen-readers by leaving its alt attribute empty.

    You can read more about this here 📘.

  CSS 🎨:

  • Use min-height: 100vh instead of height: 100vh. The height property will not work if the content of the page grows beyond the height of the viewport.

  I hope you find it useful! 😄 Above all, the solution you submitted is great!

  Happy coding!

  Marked as helpful

  2

  ---

  

  Nicolas Leon•70

  @LeonngcPosted almost 2 years ago

  @MelvinAguilar Thank you bro. I will improve the solution

  0

  

  Lauryne•260

  @lauryne921Posted almost 2 years ago

  @MelvinAguilar Thank for answering me !

  I often forget the footer, I'll try to not forget that now and thank you for the advice on the height, I always hesitate between 'height' and 'min-height' but now I know which one to choose 😉

  Happy Coding

  0