<style>
	.scroll
		{
			min-height: 67.5%;
			width: 26.5%;
			position: absolute;
			top: 162%;
			overflow: scroll;
			border-radius: 5px;
		}
</style>
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>test table</title>
	<link rel="stylesheet" type="text/css" href="bootstrap-5.3.2-dist/css/bootstrap.css">
	<link rel="stylesheet" type="text/css" href="bootstrap-5.3.2-dist/css/bootstrap-grid.css">
</head>
<body>
	<?php 
      include_once('connection.php');

    ?>
	<table class = "table caption-top table-light table-bordered table-responsive">
		<div class = "scroll" >
								
					<colgroup>
						<col id = "id"></col>					
						<col id = "sendername"></col>
						<col id = "senderemail"></col>
						<col id = "sendercontact"></col>					
						<col id = "senderaddress"></col>
						<col id = "dispatchlocation"></col>
						<col id = "receivername"></col>					
						<col id = "receivercontact"></col>
						<col id = "receiveremail"></col>
						<col id = "receiveraddress"></col>					
						<col id = "ftype"></col>
						<col id = "edd"></col>
					</colgroup>

					<thead>
						<tr>
							<th class = "id" scope="col">id</th>					
							<th class = "sendername" scope = "col">sendername</th>
							<th class = "senderemail" scope = "col">senderemail</th>
                            <th class="sendercontact" scope="col">sendercontact</th>
                            <th class="senderaddress" scope="col">senderaddress</th>
                            <th class="dispatchlocation" scope="col">dispatchlocation</th>
                            <th class="receivername" scope="col">receivername</th>
                            <th class="receivercontact" scope="col">receivercontact</th>
                            <th class="receiveremail" scope="col">receiveremail</th>
                            <th class="receiveraddress" scope="col">receiveraddress</th>
                            <th class="ftype" scope="col">ftype</th>
                            <th class="edd" scope="col">edd</th>
						</tr>
					</thead>
					 <?php
                                       $x=1;
                                      while($rows = mysqli_fetch_assoc($result))
                                      {
                                        $user_id = $rows['sendername'];
                                    ?>
                                    <tbody>
                                        <tr>
                                          <td><?php echo $x; ?></td>
                                          <td><?php echo $rows['sendername']; ?></td>
                                          <td><?php echo $rows['senderemail']; ?></td>
                                          <td><?php echo $rows['sendercontact']; ?></td>
                                          <td><?php echo $rows['senderaddress']; ?></td>
                                          <td><?php echo $rows['dispatchlocation']; ?></td>
                                          <td><?php echo $rows['receivername']; ?></td>
                                          <td><?php echo $rows['receivercontact']; ?></td>
                                          <td><?php echo $rows['receiveremail']; ?></td>
                                          <td><?php echo $rows['receiveraddress']; ?></td>
                                          <td><?php echo $rows['ftype']; ?></td>
                                          <td><?php echo $rows['edd']; ?></td>
                                        </tr>
                                        
                                    </tbody>
                                        
                                    <?php
                                    $x++;
                                     ?>
                                     <?php

                                      }
                                    ?>
		</div>
	</table>

</body>
</html>