Last item's list component not complete show

[Joak]

Hi

I have one list component, and sometimes the last item not show complete(of course I have the scroll), here the example…

What’s wrong? could you help me, please?

The html file …

<div class="page img_show_info" data-name="detalle-goleo">
    <div class="navbar" id="navbar-detalle-goleo">
      <div class="navbar-bg"></div>   
      <div class="navbar-inner">
        <div class="left">
          <a href="#" class="link back">
              <i class="f7-icons icon-custom">arrow_left</i>
            </a>
        </div>
        <div class="title navbar-tipo-letra">Detalle</div>
        <div class="right">
        </div>
      </div>
    </div>
    <!-- Bottom Toolbar -->
    <div class="toolbar toolbar-bottom toolbar-custom">
      <div class="toolbar-inner">
        <!-- Toolbar links -->
        <a href="/home/" class="link">
          <i class="icon f7-icons color-white">start</i>
          <span class="my-color-off">Inicio</span>
        </a>
      </div>
    </div>
    <div class="page-content">
      <div class="block-detalle-datjugador" id="show-dat-jugador">
        <div class="nom_jugador">Mario Broos</div>
        <div class="nom_equipo">Pumas</div>
        <div class="row">
          <div class="col num_playera">Playera: 125</div>
          <div class="col num_playera" id="total_goles">Puntos: 45</div>
        </div>
      </div>
      <div class="list list-cedula-sel" id="lista-detalle">
        <div class="block img-background">
          <div class="block fecha-juego">
              <div class="row">
                  <div class="col" id="fecha-hora-juego">18/07/2020 22:30 J-10</div>
              </div>
          </div>
          <div class="block det-goles">
              <div class="row">
                  <div class="col">12</div>
                  <div class="row">
                    <div class="col icon-det-goles"><img src="../img/Balon.ico" width="40"/></div>
                  </div>
              </div> 
          </div>
          <div class="block det-goleo-equipo">
              <div class="row">
                  <div class="col" id="equipo-local">DON GATO</div>
              </div>
          </div>
        </div>
      </div> 
    </div>
</div>

The CSS file…

.block-detalle-datjugador{
    background: transparent;
    width: 100%;
    height: 125px;
    margin-left: auto;
    margin-right: auto;
}

.nom_equipo{
    top: 20px;
    font-size: 20px;
    text-align: center;
    color:  rgb(239,160,65);
}

.num_playera{
    top: 23px;
    font-size: 20px;
    text-align: center;
    color: rgb(239,160,65);
}

.nom_jugador{
    font-size: 22px;
    text-align: center;
    color:rgb(239,160,65);
}

.list-cedula-sel{
    margin-right: .6%;
    height: 75px;  
    padding-top: 7px;
}

.img-background{
    height: 100%;
    width: 100%;
    background-size:cover;
    background-image: url(../img/BackGroundDetGol.png);
    background-repeat: no-repeat;
    margin-top: 0;
}

.fecha-juego{
    position: absolute;
    margin: 0;
    margin-left: 50%;
    width: 45%;
    color:white;
    font-size: 12px;
    font-weight: bold;
}

.det-goles{
    position: absolute;
    width: 20%;
    height: 70%;
    line-height: normal;
    left: 0; /* X */
    margin-left: 30px;
    top: 0; /* Y */
    margin-top: 5px;
    transform: translate(0, 0); /* Reposicionar X,Y */
    text-align: center;
    color: white;
    font-size: 40px;
    font-family:  font-navbar;
    font-weight: bold;
}

.icon-det-goles{
    position: absolute;
    width: 20%;
    height: 70%;
    line-height: normal;
    left: 0; /* X */
    top: 0; /* Y */
    margin-top: 15px;
    margin-left: 55px;
    transform: translate(0, 0); /* Reposicionar X,Y */
    text-align: center;
}

.det-goleo-equipo{
    display: flex;
    position: absolute;
    width: 35%;
    height: 80%;
    margin-left: 190px;
    margin-top: 15px;
    font-family: 'font-navbar';
    justify-content: center;
    align-items: center;
    color:white;
}