Mobile first workflow using CSS Grid and Flexbox

Nice work with the design and the code overall. I really like the use of BEM classes for this project.

The reason why the website is not aligning vertically is because the page is not full screen. If you check your solution in a web browser and hover over a body (or put background color on a body) element you can see that it's not a full page. To resolve that issue, you can put a min-height of 100vh on a body element.

In your case, you can set min-height on a class "container" and because you are already using a grid you can just use also place-items: center; to align items horizontally and vertically.

This next suggestion is more for git and GitHub in general than for this project but I think it will be helpful.

I would also like to suggest that you put some context on your commit messages or at least what did you change on that commit. Instead of "commit update 8" you can write something like "update cards alignment", or "If applied, this commit will update getting started documentation"

For git messages, I would suggest this article: "How to Write a Git Commit Message - Chris Beams".

One last thing is to check again the email on Git and GitHub because looks like they are different and because of that on your GitHub it's only showing one contribution instead of 9 for today

Nice work on submitting this challenge, Glen.

The html file has a "class" element that has been highlighted in the above report, but I think this was a typing error and it should be a "div" element?

Check-out this pen (https://codepen.io/will-1-am-the-Iceman/pen/gOgBrVP) for a suggestion on how to center everything horizontally and vertically - you can see the html and css and test til your heart's content.

The background-color set on ".btn" should be very-light-grey and not white as stated in the spec, but to be fair is very difficult to discern - I also got caught out on this one. 😅

I really like the idea that the buttons don't loose their alignment with one another. As very small viewport width the button text does wrap to additional lines and this can be resolved by applying a min-width on the cards container.

I hope this helps. Happy coding!