Can't get my document page menu to hit top of page

I have my menu and I’ve set the height of the list to height: 100% but I still have an immovable gap at the top of the page above it. Any ideas what I’m doing wrong?

line 18 of my css
https://codepen.io/JammyPiece/pen/joVZqg

It’s caused by the default margin on your h1.

A quick fix would be to remove that margin and instead add a padding of your choosing.

Remove margin and padding property and use top: 0px

You set display to FIXED and this means you are taking it out of the current flow of the document and so margins and paddings can no longer affect that element what works now are offsets like: top, left, right, bottom