<div class="overflow-x-auto">
     <table class="table table-bordered">
         <thead>
             <tr>
                 <th class="whitespace-nowrap">#</th>
                 <th class="whitespace-nowrap">First Name</th>
                 <th class="whitespace-nowrap">Last Name</th>
                 <th class="whitespace-nowrap">Username</th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td>1</td>
                 <td>Angelina</td>
                 <td>Jolie</td>
                 <td>@angelinajolie</td>
             </tr>
             <tr>
                 <td>2</td>
                 <td>Brad</td>
                 <td>Pitt</td>
                 <td>@bradpitt</td>
             </tr>
             <tr>
                 <td>3</td>
                 <td>Charlie</td>
                 <td>Hunnam</td>
                 <td>@charliehunnam</td>
             </tr>
         </tbody>
     </table>
 </div> 

  <div class="overflow-x-auto">
     <table class="table table-bordered table-hover">
         <thead>
             <tr>
                 <th class="whitespace-nowrap">#</th>
                 <th class="whitespace-nowrap">First Name</th>
                 <th class="whitespace-nowrap">Last Name</th>
                 <th class="whitespace-nowrap">Username</th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td>1</td>
                 <td>Angelina</td>
                 <td>Jolie</td>
                 <td>@angelinajolie</td>
             </tr>
             <tr>
                 <td>2</td>
                 <td>Brad</td>
                 <td>Pitt</td>
                 <td>@bradpitt</td>
             </tr>
             <tr>
                 <td>3</td>
                 <td>Charlie</td>
                 <td>Hunnam</td>
                 <td>@charliehunnam</td>
             </tr>
         </tbody>
     </table>
 </div> 

  <div class="overflow-x-auto">
     <table class="table">
         <thead>
             <tr>
                 <th class="whitespace-nowrap">#</th>
                 <th class="whitespace-nowrap">First Name</th>
                 <th class="whitespace-nowrap">Last Name</th>
                 <th class="whitespace-nowrap">Username</th>
             </tr>
         </thead>
         <tbody>
             <tr class="bg-primary text-white">
                 <td>1</td>
                 <td>Angelina</td>
                 <td>Jolie</td>
                 <td>@angelinajolie</td>
             </tr>
             <tr class="bg-danger text-white">
                 <td>2</td>
                 <td>Brad</td>
                 <td>Pitt</td>
                 <td>@bradpitt</td>
             </tr>
             <tr class="bg-warning">
                 <td>3</td>
                 <td>Charlie</td>
                 <td>Hunnam</td>
                 <td>@charliehunnam</td>
             </tr>
         </tbody>
     </table>
 </div> 

  <div class="overflow-x-auto">
     <table class="table">
         <thead>
             <tr>
                 <th class="whitespace-nowrap">#</th>
                 <th class="whitespace-nowrap">First Name</th>
                 <th class="whitespace-nowrap">Last Name</th>
                 <th class="whitespace-nowrap">Username</th>
                 <th class="whitespace-nowrap">Email</th>
                 <th class="whitespace-nowrap">Address</th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td class="whitespace-nowrap">1</td>
                 <td class="whitespace-nowrap">Angelina</td>
                 <td class="whitespace-nowrap">Jolie</td>
                 <td class="whitespace-nowrap">@angelinajolie</td>
                 <td class="whitespace-nowrap">angelinajolie@gmail.com</td>
                 <td class="whitespace-nowrap"> 260 W. Storm Street New York, NY 10025. </td>
             </tr>
             <tr>
                 <td class="whitespace-nowrap">2</td>
                 <td class="whitespace-nowrap">Brad</td>
                 <td class="whitespace-nowrap">Pitt</td>
                 <td class="whitespace-nowrap">@bradpitt</td>
                 <td class="whitespace-nowrap">bradpitt@gmail.com</td>
                 <td class="whitespace-nowrap"> 47 Division St. Buffalo, NY 14241. </td>
             </tr>
             <tr>
                 <td class="whitespace-nowrap">3</td>
                 <td class="whitespace-nowrap">Charlie</td>
                 <td class="whitespace-nowrap">Hunnam</td>
                 <td class="whitespace-nowrap">@charliehunnam</td>
                 <td class="whitespace-nowrap">charliehunnam@gmail.com</td>
                 <td class="whitespace-nowrap"> 8023 Amerige Street Harriman, NY 10926. </td>
             </tr>
         </tbody>
     </table>
 </div> 

  <div class="overflow-x-auto">
     <table class="table table-sm">
         <thead>
             <tr>
                 <th class="whitespace-nowrap">#</th>
                 <th class="whitespace-nowrap">First Name</th>
                 <th class="whitespace-nowrap">Last Name</th>
                 <th class="whitespace-nowrap">Username</th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td>1</td>
                 <td>Angelina</td>
                 <td>Jolie</td>
                 <td>@angelinajolie</td>
             </tr>
             <tr>
                 <td>2</td>
                 <td>Brad</td>
                 <td>Pitt</td>
                 <td>@bradpitt</td>
             </tr>
             <tr>
                 <td>3</td>
                 <td>Charlie</td>
                 <td>Hunnam</td>
                 <td>@charliehunnam</td>
             </tr>
         </tbody>
     </table>
 </div> 

  <div class="overflow-x-auto">
     <table class="table table-striped">
         <thead>
             <tr>
                 <th class="whitespace-nowrap">#</th>
                 <th class="whitespace-nowrap">First Name</th>
                 <th class="whitespace-nowrap">Last Name</th>
                 <th class="whitespace-nowrap">Username</th>
             </tr>
         </thead>
         <tbody>
             <tr>
                 <td>1</td>
                 <td>Angelina</td>
                 <td>Jolie</td>
                 <td>@angelinajolie</td>
             </tr>
             <tr>
                 <td>2</td>
                 <td>Brad</td>
                 <td>Pitt</td>
                 <td>@bradpitt</td>
             </tr>
             <tr>
                 <td>3</td>
                 <td>Charlie</td>
                 <td>Hunnam</td>
                 <td>@charliehunnam</td>
             </tr>
         </tbody>
     </table>
 </div>