Responsive recipe page

Community feedback

• 

  P

  Steven Stroud•11,890

  @StroudyPosted about 2 months ago

  Hello again fellow coder, Fantastic effort on this! You’re really nailing it. Just a few things I noticed that could make it even better…

  • I think you can benefit from a VScode Plugin called prettier that can format your CSS make it nice, neat and consistent.

  • Your heading elements <h1><h4><h3>, Heading elements should be in sequentially-descending order (e.g., <h1>, <h2>, <h3>) to create a clear content structure, improving accessibility and SEO. Skipping levels or using them out of order can confuse screen readers, affect search engine rankings, and make your content harder to understand.

    <h1>Simple Omelette Recipe</h1>
    <p id="p1">An easy and quick dish, perfect for any meal. This classic omelette combines beaten eggs cooked 
    to perfection, optionally filled with your choice of cheese, vegetables, or meats.</p> 
    
    <div class="preparation">  
      <h4>Preparation time</h4>
      <ul>
        <li><span><b>Total:</b> Approximately 10 minutes</span></li>
        <li><span><b>Preparation:</b> 5 minutes</span></li>
        <li><span><b>Cooking:</b> 5 minutes</span></li>
      </ul>
    </div>
    <div class="ingredients">
      <h3 >Ingredients</h3> 
  

  • Using a full modern CSS reset is beneficial because it removes default browser styling, creating a consistent starting point for your design across all browsers. It helps avoid unexpected layout issues and makes your styles more predictable, ensuring a uniform appearance on different devices and platforms, check out this site for a Full modern reset

  • Avoid using id selectors for styling in CSS because they are too specific and hard to override, making your styles less flexible and maintainable. Instead, use class selectors (.), which are reusable and more manageable, allowing for better control over your styles and easier updates.

  I hope you found this advice helpful! Keep up the great work, You’re doing amazing, and I can’t wait to see what you create next. Happy coding! 🚀

  2
• 

  ManPP•130

  @WhitezerDPosted about 2 months ago

  Keep up the good work.

  1