FAQ accordion card challenge

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted about 3 years ago

  👋Hi Mohamed Lem!

  I have some feedback on this solution:

  • Development code is not production code. You should remove the unnecessary code instead of leaving them as commented code. The reason for that is because, it will confused yourself in the future, whether you should use it or delete it.
  • For any decorative images, you should leave the alt="" empty and add aria-hidden="true" to make all screen readers ignore those images. In this case, all images are decorative only.
  • On mobile view, the card is so narrow. I think flex-basis: 60%; causing this issue. My recommendation is to make the flex-basis: 100%; and add padding on the body element, to prevent the card having full width.
  • For the body font size, I recommend to use rem unit too.
  • Try to do challenge with JavaScript, since the non JavaScript is the additional challenge, not the main challenge. Keep trying!🔥
  • I recommend to use BEM class naming convention. It really make it easier for you to maintain the styling.

  That's it! Hopefully this is helpful!

  Marked as helpful

  1
• 

  P

  Ken•4,915

  @kens-visualsPosted about 3 years ago

  Hey @MedtheVorg 👋🏻

  I won't roast you 😅 but I have some suggestion on HTML issue. Also, I have some tip for you 🙃

  • In general, <section> is used for bigger sections in your markup, such as image gallery, about us, etc. you get the point. And besides that when you use <section> you have to have a heading <h1>-<h6>. Therefore, I suggest replacing <section> with <div>.
  • This is the tip of the day 😃 check this out. It will help you to fully finish the project without any JS. If you get stuck, you can check out my solution, I used the same technique.

  I hope this was helpful 👨🏻‍💻 the layout look excellent, just work on the functionality. Cheers 👾

  Marked as helpful

  1