diff --git a/templates/server/databases/index.twig b/templates/server/databases/index.twig
index 61ebf89d75..1cc49236bf 100644
--- a/templates/server/databases/index.twig
+++ b/templates/server/databases/index.twig
@@ -94,7 +94,7 @@
     <form class="ajax" action="{{ url('/server/databases') }}" method="post" name="dbStatsForm" id="dbStatsForm">
       {{ get_hidden_inputs(url_params) }}
       <div class="table-responsive row">
-        <table class="table table-striped table-hover">
+        <table class="table table-striped table-hover w-auto">
           <thead class="thead-light">
             <tr>
               {% if is_drop_allowed %}
diff --git a/templates/server/status/status/index.twig b/templates/server/status/status/index.twig
index 0f3826a031..ea05bcb3e9 100644
--- a/templates/server/status/status/index.twig
+++ b/templates/server/status/status/index.twig
@@ -7,46 +7,46 @@
   <div class="row"><p>{{ 'This MySQL server has been running for %1$s. It started up on %2$s.'|trans|format(uptime, start_time) }}</p></div>
 
 <div class="row justify-content-between">
-  <table id="serverstatustraffic" class="pma-table w-100 data noclick col-12 col-md-5">
-    <thead>
+  <table class="table table-light table-striped col-12 col-md-5">
+    <thead class="thead-light">
       <tr>
-        <th>
+        <th scope="col">
           {% trans 'Traffic' %}
           {{ show_hint('On a busy server, the byte counters may overrun, so those statistics as reported by the MySQL server may be incorrect.'|trans) }}
         </th>
-        <th>#</th>
-        <th>&oslash; {% trans 'per hour' %}</th>
+        <th scope="col">#</th>
+        <th scope="col">{% trans 'ø per hour' %}</th>
       </tr>
     </thead>
 
     <tbody>
       {% for each_traffic in traffic %}
         <tr>
-          <th class="name">{{ each_traffic.name }}</th>
-          <td class="value">{{ each_traffic.number }}</td>
-          <td class="value">{{ each_traffic.per_hour }}</td>
+          <th scope="row">{{ each_traffic.name }}</th>
+          <td class="text-monospace text-right">{{ each_traffic.number }}</td>
+          <td class="text-monospace text-right">{{ each_traffic.per_hour }}</td>
         </tr>
       {% endfor %}
     </tbody>
   </table>
 
-  <table id="serverstatusconnections" class="pma-table w-100 data noclick col-12 col-md-6">
-    <thead>
+  <table class="table table-light table-striped col-12 col-md-6">
+    <thead class="thead-light">
       <tr>
-        <th>{% trans 'Connections' %}</th>
-        <th>#</th>
-        <th>&oslash; {% trans 'per hour' %}</th>
-        <th>%</th>
+        <th scope="col">{% trans 'Connections' %}</th>
+        <th scope="col">#</th>
+        <th scope="col">{% trans 'ø per hour' %}</th>
+        <th scope="col">%</th>
       </tr>
     </thead>
 
     <tbody>
       {% for connection in connections %}
         <tr>
-          <th class="name">{{ connection.name }}</th>
-          <td class="value">{{ connection.number }}</td>
-          <td class="value">{{ connection.per_hour }}</td>
-          <td class="value">{{ connection.percentage }}</td>
+          <th scope="row">{{ connection.name }}</th>
+          <td class="text-monospace text-right">{{ connection.number }}</td>
+          <td class="text-monospace text-right">{{ connection.per_hour }}</td>
+          <td class="text-monospace text-right">{{ connection.percentage }}</td>
         </tr>
       {% endfor %}
     </tbody>
diff --git a/themes/bootstrap/scss/_common.scss b/themes/bootstrap/scss/_common.scss
index d35a1517ff..6c2cf29271 100644
--- a/themes/bootstrap/scss/_common.scss
+++ b/themes/bootstrap/scss/_common.scss
@@ -1178,13 +1178,12 @@ div#serverstatusquerieschart {
 }
 
 table {
-  &#serverstatusqueriesdetails,
-  &#serverstatustraffic {
+  &#serverstatusqueriesdetails {
     float: $left;
-  }
 
-  &#serverstatusqueriesdetails th {
-    min-width: 35px;
+    th {
+      min-width: 35px;
+    }
   }
 
   &#serverstatusvariables {
@@ -1200,10 +1199,6 @@ table {
       width: 6em;
     }
   }
-
-  &#serverstatusconnections {
-    float: $left;
-  }
 }
 
 div {
@@ -3738,10 +3733,6 @@ body .ui-dialog {
     display: none;
   }
 
-  table#serverstatusconnections {
-    margin-#{$left}: 0;
-  }
-
   #table_name_col_no {
     top: 62px;
   }
diff --git a/themes/metro/scss/_common.scss b/themes/metro/scss/_common.scss
index f57a9ab0c7..e2a095237b 100644
--- a/themes/metro/scss/_common.scss
+++ b/themes/metro/scss/_common.scss
@@ -1227,14 +1227,14 @@ div#serverstatusquerieschart {
 }
 
 table {
-  &#serverstatusqueriesdetails,
-  &#serverstatustraffic {
+  &#serverstatusqueriesdetails {
     float: $left;
+
+    th {
+      min-width: 35px;
+    }
   }
 
-  &#serverstatusqueriesdetails th {
-    min-width: 35px;
-  }
 
   &#serverstatusvariables {
     width: 100%;
@@ -1249,11 +1249,6 @@ table {
       width: 6em;
     }
   }
-
-  &#serverstatusconnections {
-    float: $left;
-    margin-#{$left}: 30px;
-  }
 }
 
 div {
diff --git a/themes/metro/scss/_tables.scss b/themes/metro/scss/_tables.scss
index 6502d0dfa3..1f3575011d 100644
--- a/themes/metro/scss/_tables.scss
+++ b/themes/metro/scss/_tables.scss
@@ -1,6 +1,4 @@
 .table {
-  width: auto;
-
   td {
     touch-action: manipulation;
     vertical-align: middle;
diff --git a/themes/original/scss/_common.scss b/themes/original/scss/_common.scss
index 8143fe147d..02a28dac9c 100644
--- a/themes/original/scss/_common.scss
+++ b/themes/original/scss/_common.scss
@@ -968,15 +968,6 @@ div {
 }
 
 table {
-  &#serverstatustraffic {
-    float: $left;
-  }
-
-  &#serverstatusconnections {
-    float: $left;
-    margin-#{$left}: 30px;
-  }
-
   &#serverstatusvariables {
     width: 100%;
     margin-bottom: 1em;
@@ -990,11 +981,6 @@ table {
       width: 6em;
     }
   }
-
-  &#serverstatusconnections {
-    float: $left;
-    margin-#{$left}: 30px;
-  }
 }
 
 div {
@@ -3429,10 +3415,6 @@ body {
     display: none;
   }
 
-  table#serverstatusconnections {
-    margin-#{$left}: 0;
-  }
-
   #table_name_col_no {
     top: 62px;
   }
diff --git a/themes/original/scss/_tables.scss b/themes/original/scss/_tables.scss
index 13e68c9975..ea6a20660d 100644
--- a/themes/original/scss/_tables.scss
+++ b/themes/original/scss/_tables.scss
@@ -1,6 +1,5 @@
 .table {
   border-collapse: separate;
-  width: auto;
 
   td {
     touch-action: manipulation;
diff --git a/themes/pmahomme/scss/_common.scss b/themes/pmahomme/scss/_common.scss
index c8e75edde7..7598f2df04 100644
--- a/themes/pmahomme/scss/_common.scss
+++ b/themes/pmahomme/scss/_common.scss
@@ -1233,14 +1233,14 @@ div#serverstatusquerieschart {
 }
 
 table {
-  &#serverstatusqueriesdetails,
-  &#serverstatustraffic {
+  &#serverstatusqueriesdetails {
     float: $left;
+
+    th {
+      min-width: 35px;
+    }
   }
 
-  &#serverstatusqueriesdetails th {
-    min-width: 35px;
-  }
 
   &#serverstatusvariables {
     width: 100%;
@@ -1255,10 +1255,6 @@ table {
       width: 6em;
     }
   }
-
-  &#serverstatusconnections {
-    float: $left;
-  }
 }
 
 div {
@@ -3801,10 +3797,6 @@ body .ui-dialog {
     display: none;
   }
 
-  table#serverstatusconnections {
-    margin-#{$left}: 0;
-  }
-
   #table_name_col_no {
     top: 62px;
   }
diff --git a/themes/pmahomme/scss/_tables.scss b/themes/pmahomme/scss/_tables.scss
index 68a74dbd1c..d947a147db 100644
--- a/themes/pmahomme/scss/_tables.scss
+++ b/themes/pmahomme/scss/_tables.scss
@@ -1,6 +1,4 @@
 .table {
-  width: auto;
-
   th,
   td {
     text-shadow: 0 1px 0 #fff;
@@ -8,7 +6,6 @@
 
   th {
     text-align: $left;
-    background-image: linear-gradient(#fff, #ccc);
   }
 
   td {
@@ -18,6 +15,7 @@
 
   thead th {
     border-#{$right}: 1px solid #fff;
+    background-image: linear-gradient(#fff, #ccc);
   }
 }