Блог

 <div class="table-responsive">
                
                  <table class="table table-striped">
                     
                    <thead>
                      <tr>
                        <th>Agent Name</th>
                        <th>Total number calls audited</th>
                        <th>Fatal Count</th>
                        <th>Score</th>  
                        <th>Average</th>      
                      </tr>
                    </thead>
                    <!-- <div style="overflow:scroll;min-height:.01%;overflow-y:hidden;overflow-x:scroll;"> -->
                  <tbody>
                 
                   
                        <?php 
                      
                        $totalauditded=0;
                        $totalfatal=0;
                        $listau=$aucnt->result();   
                        $totalauditded =$rpostclist->audited;
                        $totalfatal =$rpostclist->cnfatal;
                        ?>
                          <tr>
                              <td><?php echo $rpostclist->agent_name;?></td>
                              <td><?php echo $rpostclist->audited;?></td>
                              <td><?php echo $rpostclist->cnfatal;?></td>
                              
                              <td>
                                
                                <table class="table table-bordered">
                                  <tr>
                                                        <?php  $i=1; foreach($listau as $raucnt) { ?>
                                      <th> Call <?php echo $i;?><br/><?php echo $raucnt->qa_agent;?><br/><?php echo $raucnt->qa_date; ?><br><a href="<?php echo base_url();?>home/viewticket/<?php echo $raucnt->unique_id;?>" class="btn btn-link" target="_blank" style="width:55px;height:30px;">View</a></th>
                                        <?php $i  ;} ?>
                                  </tr>
                                  <tr>
                                    <?php $sum = 0; foreach($listau as $raucnt) { ?>
                                    <td><?php echo $raucnt->tot;
                                                          $sum  = $raucnt->tot;?>%</td>
                                    <?php } ?>
                                  </tr>
                                
                                </table>
                              </td>
                            <td style="vertical-align:middle;font-weight:bold;font-size:20px;"><?php echo round($average=$sum/count($listau));?>%</td>
                          </tr>
                 
                        <?php } ?>
                        <tr>
                            <td></td>
                            <td style="font-size:16px;"><strong>Total:<?php echo $totalauditded;?></strong></td>
                            <td style="font-size:16px;"><strong>Total:<?php echo $totalfatal;?></strong></td>
                        </tr>
                        </tbody>
                    </table>
                    </div>
              </div>
                                    </div>
 

Я погуглил, но не нашел никаких решений. Я пытаюсь сохранить горизонтальную полосу в верхней части таблицы, так как она извлекает много данных из базы данных, которую трудно прокрутить. Возможно, как верхняя, так и нижняя горизонтальная полоса прокрутки также хороши для предложений.

Используйте css

 overflow-x : auto;
 

Ссылка

https://www.w3schools.com/howto/howto_css_menu_horizontal_scroll.asp

Я изменил ось контейнера на 180 градусов

 <div class=" table-responsive"style="transform: rotateX(180deg);">
                
                  <table class="table table-striped" style="transform: rotateX(180deg);">```
 

 <div class="table-responsive">
 

изменить на

 <div class="table-responsive" style="overflow-y: scroll; overflow-x: auto">