Semantic HTML5 markup, CSS custom properties, Flexbox, JavaScript

Community feedback

• 

  romila•3,550

  @romila2003

  Posted over 2 years ago

  Hi Nneoma,

  Congratulations 🎉 for completing this challenge, the FAQ component looks great and is responsive. Also, it is great that you used the correct semantic for the main content and took a mobile-first approach since this is best practice. There are some issues/suggestions I want to address:

  1. You should also wrap the footer within the footer tag e.g. <footer class="attribution2></footer>
  2. I would not recommend using the section tag for the image, instead you should use the picture tag as this is semantically correct.
  3. Since you used the article tag to wrap the Q and A, you need to use at least 1 heading (any between h2 to h6). In your case, you can use the header for the question and the p tag for the answer.
  4. Regarding your question with the background, you just have to remove the colors that you repeated like this:

  body {
     background: linear-gradient(hsl(273, 75%, 66% , hsl(240, 73%, 65%) );
  }
  

  Overall, great work and wish you the best for your future projects so keep coding 👍.

  01

  Marked as helpful