Responsive Card using CSS grid

Hi,

well done to finish this project. There is a few things that I would have done differently:

HTML

• I noticed you used a few semantic HTML elements, but there is a few area that I think would made sense to use some more. I am mention this, because it provides additional information that helps define the roles and relative importance of the different parts of your page compare to non-semantic HTML.

  • For the element with the class of card, you could have use an article. If it was a whole page and the card was just one of many items one the page, you will find like <header>,<main>, and <footer> on it. And usually, you will find one of each per page. With the article-element you are able to use atleast header, footer inside an inside it to structure your HTML, and it helps with the accessibilty.
  • another semantic Element I suggest you look into, is the picture-element for bigger projects.

** CSS **

• to center the content I should have used place-content: center instead of place-items: center