Recipe page with Flexbox and Grid

Community feedback

• 

  Moses•340

  @mbtenkorangPosted 9 months ago

  Hello 🙋‍♂️ @jjdavenport,

  Congratulations on completing the challenge. 👏🎊🥳🎉

  A few tips for improvement in relation to semantic HTML;

  • Use <section> tags for the various parts i.e.: Nutrition, Ingredients, Instructions,Preparation time instead of <div> tags.
  • Use the same heading tags except an <h1> for the headings of the sections instead of giving a lower section heading for each.
  • Use a <p> tag for the text that introduces the <table> rather than a <legend> tag
  • Change <div class="attribution"> to <footer class="attribution"> to pass the HTML validation test

  I am sure implementing these changes will improve your solution.

  All the best and happy coding 😀🧑‍💻🌟

  Marked as helpful

  3
• 

  Rahul Kumar•570

  @rahulkumar215Posted 9 months ago

  Hello👋

  Congratulations on successfully completing the challenge! 🎉

  I have a suggestion regarding your code that I believe will be of great interest to you.

  • as @mbtenkorang mentioned, You should use <p> paragraph HTML tag instead of <legend>, I would like to add that you have added the <legend> inside the table,

  Here

    <table>
      <legend>
        The table below shows nutritional values per serving without the
        additional fillings.
      </legend>
      <tr>
        <td>Calories</td>
        <td>277kcal</td>
      </tr>
      <tr>
        <td>Carbs</td>
        <td>0g</td>
      </tr>
      <tr>
        <td>Protein</td>
        <td>20g</td>
      </tr>
      <tr>
        <td>Fat</td>
        <td>22g</td>
      </tr>
    </table>
  

  However, there is no need to do so, you can do this instead

    <p>
      The table below shows nutritional values per serving without the
      additional fillings.
    </p>
    <table>
      <tr>
        <td>Calories</td>
        <td>277kcal</td>
      </tr>
      <tr>
        <td>Carbs</td>
        <td>0g</td>
      </tr>
      <tr>
        <td>Protein</td>
        <td>20g</td>
      </tr>
      <tr>
        <td>Fat</td>
        <td>22g</td>
      </tr>
    </table>
  

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  If you need any feedback or suggestions, I am happy to help

  Have Fun Coding!

  Marked as helpful

  1