Блог

У меня есть две вкладки из начальной загрузки

Проблема в том, что вкладки не прокручиваются в y после 100vh

Означает, что когда я начинаю прокручивать, он застревает.

У меня есть 100 данных в день на веб-сайте, но. Это меня сильно раздражает, и я получаю данные из своей таблицы.

Означает, что вкладки серьезно не прокручиваются после 100vh.

Я много пробовал, но ничего не получалось.

Вот мой код

 <nav>
  <div class="nav nav-tabs" id="nav-tab" role="tablist">
    <a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab" aria-controls="nav-home" aria-selected="true">Entries</a>
    <a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#nav-profile" role="tab" aria-controls="nav-profile" aria-selected="false">Contact's</a>

  </div>
</nav>
<div class="tab-content" id="nav-tabContent">
  <div class="tab-pane fade show active" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab" >
    
            <table class="table table-striped my-5">
            <thead>
                <tr>
                    <th scope="col">#</th>
                    <th scope="col">Name</th>
                    <th scope="col">email</th>
                    <th scope="col">Image</th>
                    <th scope="col">Time</th>
                    <th scope="col">Actions</th>
                </tr>
            </thead>
            <tbody>
                
                    <?php

                    $sql = "SELECT * FROM `table` ORDER BY id DESC";


                    $res = mysqli_query($con, $sql);

                    $index = 1;

                    while ($row = mysqli_fetch_assoc($res)) {

                        $id = $row['id'];
                        $name = $row['Name'];
                        $email = $row['Email'];
                        $img = $row['Img'];
                        $time = $row['time'];

                        echo '
                        <tr>
      <th scope="row">'.$index.'</th>
      <td>'.$name.'</td>
      <td>'.$email.'</td>
      <td><a href="../../'.$img.'">Image</a></td>
      <td>'.$time.'</td>
      <td>
      
      <div class="row">
      <button class="btn btn-primary btn-sm" onclick="deleteEntry('.$id.')"><i class="fa fa-trash" aria-hidden="true"></i></button>
      <button class="btn btn-primary btn-sm ml-2" onclick="makeWinner('.$id.')"><i class="fa fa-trophy" aria-hidden="true"></i></button>
      </div>
      </td>
      </tr>
      ';

                        $index  ;
                    }
                    ?>
                

            </tbody>
        </table>
  </div>
  <div class="tab-pane fade" id="nav-profile" role="tabpanel" aria-labelledby="nav-profile-tab">
    
    <div class="container">
        
        
        <table class="table table-striped my-5">
            <thead>
                <tr>
                    <th scope="col">#</th>
                    <th scope="col">Name</th>
                    <th scope="col">email</th>
                    <th scope="col">Msg</th>
                    <th scope="col">Time</th>
                </tr>
            </thead>
            <tbody>
    
                        <?php

                    $sql = "SELECT * FROM `Contact` ORDER BY id DESC";


                    $res = mysqli_query($con, $sql);

                    $index = 1;

                    while ($row = mysqli_fetch_assoc($res)) {

                        $id = $row['contact_id'];
                        $name = $row['contacter_name'];
                        $email = $row['contacter_email'];
                        $msg = $row['contact_message'];
                        $time = $row['contact_dt_time'];

                        echo '
                        <tr>
      <th scope="row">'.$index.'</th>
      <td>'.$name.'</td>
      <td>'.$email.'</td>
      <td>'.$msg.'</td>
      <td>'.$time.'</td>

      </tr>
      ';

                        $index  ;
                    }
                    ?>
                        </tbody>
        </table>
                
    </div>
    
  </div>

</div>
  

Попробуйте добавить overflow-y: scroll; на нужную вкладку. Это сделает содержимое прокручиваемым по оси y.