Hi @klabruben3 👋
Very well done! 🎊🎉🚀
I like how you properly use h1, h2, h3. Remember, heading levels represent levels of heading subsections, not typographical decoration. It would be best if you did not skip sections; h1 should be followed by h2 and so on. You may read more about it in HTML - Live Standard - Headings
Use should look into using more semantic HTML instead of plain <div> elements for better accessibility. Consider replacing <div> elements with <section> semantic elements to divide your HTML document logically. You may use the <article> element to wrap the card. Consider wrapping everything with the <main> element. For example:
<body>
<main>
<article class="main-container">
<img .../>
<h1>Simple Omelette Recipe<h1>
<p>...</p>
<section>
<h2>Ingredients</h2>
...
</section>
<section>
<h2>Instructions</h2>
...
</section>
<section>
<h2>Nutrition</h2>
...
</section>
</article>
</main>
</body>
You may read more about it in:
⭐️ HTML - Living Standard - Sections
⭐️HTML - Living Standard - Sectioning content
Also, I noticed that you use the span element. It is just not necessary and can be removed. Note that span is an inline container used to mark up parts of a text for further styling purposes or apply scripting with JavaScript, for example.
Otherwise, very well done! 🚀 Impressive! 🎉 Keep it up! 👍
Marked as helpful
@klabruben3
Posted
@solvman thank you so so much, ill check out the semantics tags and where its most logical to use them. and also for the extra info about heading tags. I didn't know that there was some etiquette to follow when using them.... Otherwise thank you
