Придать предметам полную высоту контейнера с высотой 100%

Привет, я хотел бы знать, как мне сделать список пунктов контейнера, высота которого установлена ​​на 100%, расширяться по вертикали до полного потенциала или до тех пор, пока элементы не выровняются по вертикали.

Итак, у нас есть боковая вертикальная полоса, верно? Теперь внутри этой панели есть значки. Значки выровнены по вертикали с помощью display:flex; flex-flow:column;. По умолчанию элементы списка находятся в верхней части боковой панели, верно?

Ну, я хочу, чтобы элементы (значки) были в полную высоту, чтобы они были равномерно вертикальными на панели.

Базовый код

html

<!-- right bar -->
<div class = "FullH">
  <section>
    <span class = "Xm_flex-col" >
<!--   i want these to take as much space as posible vertically     -->
      <li>GF</li>
       <li>GF</li>
         <li>GF</li>
       <li>GF</li>
    </span>
  </section>
</div>

CSS

html,body{
  height:100%;
}
.FullH{
  height:100%;
  border-right:1px solid gray;
  background:blue;
  padding:1rem;
  width:1rem;
    display:flex;
}
li{
  list-style-type:none;
}
.Xm_flex-col{
  display:flex;
  flex-direction:column;
}

Сайт

https://xlaeo.tk/XM_IG/projecthm/Xproject.html

Надеюсь, все имеет смысл.