Https://www.codecademy.com/paths/web-development/tracks/getting-more-advanced-with-design/modules/learn-css-display-positioning/projects/broadway-design

link: https://www.codecademy.com/paths/web-development/tracks/getting-more-advanced-with-design/modules/learn-css-display-positioning/projects/broadway-design

I tried, with no sucesso, to make some changes to the project available on the link above.
First, I would like the li itens on the nav to stay half way of the available space for them, but they are always more close to the bottom. look here:

the css code of the header is:

header {
  background-color: #333333;
  position: fixed;
  width: 100%;
  z-index: 10;
…  font-family: 'Raleway', sans-serif;
  font-weight: 600;
  font-size: 12px;
  display: inline-block;
  width: 80px;
  top: 80px;
}

The only way I could figure out was to set posit margin-top to -20. But isnt it weird to use the minus sign? I guess there is something I am missing.

Also, I tried to make the footer fixed, but it vanished, even after fixing the z-index parameter to 10.

here is the footer css:

footer {
  background-color: #333;
  color: #fff;
  padding: 30px 0;
  position: fixed;
  z-index: 10;
  width: 100%;
}

Thank you very much!