I am using Grid to align my contact me section. It has two rows. Underneath the second row there is a large amount of white space. How do I ensure that my two rows take up all the available height in the container?
Play about with your .container class at the top of your CSS. You’ll see that removing grid-template-rows removes all the unnecessary white space.
I don’t have time to go through all the code, but there seems to be a lot of grids within grids and flexboxes within grids. I think you can simplify the code of the layout significantly and still achieve the same effect whilst not confusing yourself and your code.
@ascii Thanks that helped. Yes I have been learning Grid and Flexbox as I have worked on this project. once I have it completed I will refactor it