diff --git a/src/Table.tsx b/src/Table.tsx
index 0011381..414299d 100644
--- a/src/Table.tsx
+++ b/src/Table.tsx
@@ -92,7 +92,6 @@ export const Table = (props: TableProps) => {
     return loadingComponent;
   }
 
-  const numberOfColumns = 1 + columns.length + (!!onRowStatus ? 1 : 0);
   const numberOfVisibleSelectedRows = dataSource
     .filter((entry) => getLevelForKey(entry.id) === 0)
     .filter((entry) => selectedRowKeys.includes(entry.id)).length;
@@ -103,6 +102,17 @@ export const Table = (props: TableProps) => {
       canClick={onRowDoubleClick !== undefined}
       readonly={readonly}
     >
+      {onSelectAllRecords && (
+        <SelectAllRecordsRow
+          numberOfVisibleSelectedRows={numberOfVisibleSelectedRows}
+          numberOfRealSelectedRows={selectedRowKeys.length}
+          numberOfTotalRows={dataSource.length}
+          totalRecords={totalItems}
+          translations={translations}
+          onSelectAllRecords={onSelectAllRecords}
+          loadingComponent={loadingComponent}
+        />
+      )}
       <table>
         <thead>
           <tr>
@@ -121,18 +131,6 @@ export const Table = (props: TableProps) => {
           </tr>
         </thead>
         <tbody>
-          {onSelectAllRecords && (
-            <SelectAllRecordsRow
-              numberOfColumns={numberOfColumns}
-              numberOfVisibleSelectedRows={numberOfVisibleSelectedRows}
-              numberOfRealSelectedRows={selectedRowKeys.length}
-              numberOfTotalRows={dataSource.length}
-              totalRecords={totalItems}
-              translations={translations}
-              onSelectAllRecords={onSelectAllRecords}
-              loadingComponent={loadingComponent}
-            />
-          )}
           <Rows
             dataSource={dataSource}
             columns={columns}
diff --git a/src/components/SelectAllRecordsRow.tsx b/src/components/SelectAllRecordsRow.tsx
index 3491e5b..355af13 100644
--- a/src/components/SelectAllRecordsRow.tsx
+++ b/src/components/SelectAllRecordsRow.tsx
@@ -2,16 +2,14 @@ import styled from "styled-components";
 import { LocalizedStrings } from "../types";
 import { useState } from "react";
 
-export const Container = styled.tr`
-  cursor: auto !important;
+export const Container = styled.div`
   height: 50px;
-  &:hover {
-    background-color: transparent !important;
-  }
+  display: flex;
+  align-items: center;
+  justify-content: center;
 `;
 
 export const SelectAllRecordsRow = ({
-  numberOfColumns,
   numberOfVisibleSelectedRows,
   totalRecords,
   numberOfTotalRows,
@@ -20,7 +18,6 @@ export const SelectAllRecordsRow = ({
   loadingComponent,
   numberOfRealSelectedRows,
 }: {
-  numberOfColumns: number;
   numberOfVisibleSelectedRows: number;
   totalRecords: number;
   numberOfTotalRows: number;
@@ -81,11 +78,9 @@ export const SelectAllRecordsRow = ({
 
   return (
     <Container>
-      <td colSpan={numberOfColumns} style={{ textAlign: "center" }}>
-        {numberOfRealSelectedRows > numberOfTotalRows
-          ? allRowsAreSelected
-          : selectRowsComponent}
-      </td>
+      {numberOfRealSelectedRows > numberOfTotalRows
+        ? allRowsAreSelected
+        : selectRowsComponent}
     </Container>
   );
 };