Q:

Bottom property on a relative child with a fixed parent doesn't work

I have a child element that have position:relative ; bottom: 0; and a parent div that have position: fixed ; height: 100vh;. The child element doesn't go to the bottom, why? Below you have the fullcode. With the inspector, I see the .secondary shape on the top, instead to be on the bottom.
HTML
<div class="fullpagenav active_nav">
  <div id="secondary" class="secondary toggled-on" aria-expanded="true">
  ...
  </div>
</div>

CSS
.fullpagenav {

    position: fixed;
    height: 100vh;
    width: 100%;
    z-index: 2;

}

.secondary.toggled-on {

    width: 100%;
    display: block;
    bottom: 0;
    position: relative;

}

A:

position: relative positions an element relative to where it would normally be placed.
That is bottom: 0 says don't offset the element from where it would normally be placed.
What you're looking for is position: absolute
See the description of different position values here: https://developer.mozilla.org/en/docs/Web/CSS/position
In particular, it says this about relative (emphasis mine):

This keyword lays out all elements as though the element were not positioned, and then adjusts the element's position, without changing layout (and thus leaving a gap for the element where it would have been had it not been positioned).

