VS Code, MDN

Hi @biwwabong,

Nice project! Here are a couple of observations and suggestions for improvement:

Simplify Layout: I noticed that you’re overusing containers and semantic HTML elements. Remember, any element can be a flex child, so you can simplify your layout by making the card a flex column and using margins to position elements. This approach will clean up your project and remove unnecessary code(divs and sections).

Use of Semantic HTML: While semantic HTML is important, it’s better to use <div> elements rather than incorrect semantic tags. Using inappropriate semantic tags can negatively impact both screen readers and SEO, as it might misrepresent the content. For example, using <article> for non-article content can lead to confusion for users and search engines.

Keep up the great work!

Best, Teodor

Looks good but consider using flexbox on body:

display: flex;
  justify-content: center;
  align-items: center;
}

Then your container is right in the center and you don't have to work with margins.

<main> <article class="container"> delete article and in styles replace .container with main(without dot).