Four card feature section

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted almost 2 years ago

  Hey there! 👋 Here are some suggestions to help improve your code:

  • The main element should only ⚠️ be wrapping the card section since that is the main content of your page.

  • The intro heading and paragraph ⚠️ should be wrapped inside a header element.

  • The figure and figcaption are being used incorrectly ❌ and needed for this challenge.

  • Using CSS Grid with Grid-Template-Areas will make things way easier 💯 when building the layout; it will give you full control of the layout.

  Here is an example of how it works: EXAMPLE

  If you have any questions or need further clarification, feel free to reach out to me.

  Happy Coding! 🎆🎊🪅

  Marked as helpful

  1

  ---

  

  lamy•150

  @Lamy237Posted almost 2 years ago

  Hi @vcarames! Thank you for your feedback.

  Unfortunately, I don't know how to use an img without a figure 😅 (that's the way I learned to use it) but I will try to work on that.

  I applied all the other changes you suggested and the tip on using CSS Grid was awesome 💯! It worked perfectly 👌.

  However, I ended up not needing some of the classes I had added before. As I am using BEM, is it a good practice to keep these classes in the html although I am not using them?

  0
• 

  Nelson•2,390

  @nelsonleonePosted almost 2 years ago

  Hello......congrats on completing the challenge, well done 🎊 🎊 .

  Based on your question @melvin.... have already given a quality feedback tho. Just adding to it.

  Yes, it is right to setaria-hidden="true on them.

  Note, if any image doesn't send a message across(just for design purposes) You can see to add aria-hidden and set the alt to any empty string also;

  Have fun coding

  Marked as helpful

  0

  ---

  

  lamy•150

  @Lamy237Posted almost 2 years ago

  Hi @nelsonleone! Thank you for your feedback 👌.

  I am adding that alt ASAP 🚴‍♀️.

  0
• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted almost 2 years ago

  Hello there 👋. Good job on completing the challenge !

  Yes, it is a good idea to set the icons to aria-hidden="true" if they are not providing any additional information. This will help ensure that screen readers do not read out the icons as part of the page content, which can be distracting and confusing for users.

  Happy coding!

  Marked as helpful

  0

  ---

  

  lamy•150

  @Lamy237Posted almost 2 years ago

  Hi @MelvinAguilar! Thank you for your feedback 👌

  0