Blog preview card using HTML and CSS

I was reviewing your code and noticed an opportunity for improvement.

Here's my suggestion:

1. use desplay flexbox for body like this:

    body {
      display: flex;
      flex-direction: column;
      justify-content: center;
      height: 100vh;
    }

this will make it more easy to center the card-conatiner. if you want to learn about Flexbox https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox

1. <author> is invalid HTML Element. instead you can use the attribute rel="author" like this:

<a rel="author">Author Name</a>

https://stackoverflow.com/questions/7290504/which-html5-tag-should-i-use-to-mark-up-an-author-s-name

1. Semantics HTML you can read mdn docs here if you dont know them already https://developer.mozilla.org/en-US/docs/Glossary/Semantics