How do I remove all the white space below by contac links

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?

https://codepen.io/Jman11/pen/VqGGKa

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

1 Like