diff --git a/ui/src/components/ActiveTasksTable.tsx b/ui/src/components/ActiveTasksTable.tsx
index 3a77759..b5689c0 100644
--- a/ui/src/components/ActiveTasksTable.tsx
+++ b/ui/src/components/ActiveTasksTable.tsx
@@ -191,14 +191,16 @@ function ActiveTasksTable(props: Props & ReduxProps) {
                 padding="checkbox"
                 classes={{ stickyHeader: classes.stickyHeaderCell }}
               >
-                <Checkbox
-                  indeterminate={numSelected > 0 && numSelected < rowCount}
-                  checked={rowCount > 0 && numSelected === rowCount}
-                  onChange={handleSelectAllClick}
-                  inputProps={{
-                    "aria-label": "select all tasks shown in the table",
-                  }}
-                />
+                <IconButton>
+                  <Checkbox
+                    indeterminate={numSelected > 0 && numSelected < rowCount}
+                    checked={rowCount > 0 && numSelected === rowCount}
+                    onChange={handleSelectAllClick}
+                    inputProps={{
+                      "aria-label": "select all tasks shown in the table",
+                    }}
+                  />
+                </IconButton>
               </TableCell>
               {columns.map((col) => (
                 <TableCell
@@ -293,12 +295,14 @@ function Row(props: RowProps) {
       onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
     >
       <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
-        <Checkbox
-          onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
-            props.onSelectChange(event.target.checked)
-          }
-          checked={props.isSelected}
-        />
+        <IconButton>
+          <Checkbox
+            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+              props.onSelectChange(event.target.checked)
+            }
+            checked={props.isSelected}
+          />
+        </IconButton>
       </TableCell>
       <TableCell component="th" scope="row">
         {uuidPrefix(task.id)}
diff --git a/ui/src/components/ArchivedTasksTable.tsx b/ui/src/components/ArchivedTasksTable.tsx
index e39b414..68cc09e 100644
--- a/ui/src/components/ArchivedTasksTable.tsx
+++ b/ui/src/components/ArchivedTasksTable.tsx
@@ -218,14 +218,16 @@ function ArchivedTasksTable(props: Props & ReduxProps) {
                 padding="checkbox"
                 classes={{ stickyHeader: classes.stickyHeaderCell }}
               >
-                <Checkbox
-                  indeterminate={numSelected > 0 && numSelected < rowCount}
-                  checked={rowCount > 0 && numSelected === rowCount}
-                  onChange={handleSelectAllClick}
-                  inputProps={{
-                    "aria-label": "select all tasks shown in the table",
-                  }}
-                />
+                <IconButton>
+                  <Checkbox
+                    indeterminate={numSelected > 0 && numSelected < rowCount}
+                    checked={rowCount > 0 && numSelected === rowCount}
+                    onChange={handleSelectAllClick}
+                    inputProps={{
+                      "aria-label": "select all tasks shown in the table",
+                    }}
+                  />
+                </IconButton>
               </TableCell>
               {columns.map((col) => (
                 <TableCell
@@ -332,12 +334,14 @@ function Row(props: RowProps) {
       onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
     >
       <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
-        <Checkbox
-          onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
-            props.onSelectChange(event.target.checked)
-          }
-          checked={props.isSelected}
-        />
+        <IconButton>
+          <Checkbox
+            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+              props.onSelectChange(event.target.checked)
+            }
+            checked={props.isSelected}
+          />
+        </IconButton>
       </TableCell>
       <TableCell component="th" scope="row">
         {uuidPrefix(task.id)}
diff --git a/ui/src/components/PendingTasksTable.tsx b/ui/src/components/PendingTasksTable.tsx
index d16decd..990a8da 100644
--- a/ui/src/components/PendingTasksTable.tsx
+++ b/ui/src/components/PendingTasksTable.tsx
@@ -218,14 +218,16 @@ function PendingTasksTable(props: Props & ReduxProps) {
                 padding="checkbox"
                 classes={{ stickyHeader: classes.stickyHeaderCell }}
               >
-                <Checkbox
-                  indeterminate={numSelected > 0 && numSelected < rowCount}
-                  checked={rowCount > 0 && numSelected === rowCount}
-                  onChange={handleSelectAllClick}
-                  inputProps={{
-                    "aria-label": "select all tasks shown in the table",
-                  }}
-                />
+                <IconButton>
+                  <Checkbox
+                    indeterminate={numSelected > 0 && numSelected < rowCount}
+                    checked={rowCount > 0 && numSelected === rowCount}
+                    onChange={handleSelectAllClick}
+                    inputProps={{
+                      "aria-label": "select all tasks shown in the table",
+                    }}
+                  />
+                </IconButton>
               </TableCell>
               {columns.map((col) => (
                 <TableCell
@@ -334,12 +336,14 @@ function Row(props: RowProps) {
       onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
     >
       <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
-        <Checkbox
-          onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
-            props.onSelectChange(event.target.checked)
-          }
-          checked={props.isSelected}
-        />
+        <IconButton>
+          <Checkbox
+            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+              props.onSelectChange(event.target.checked)
+            }
+            checked={props.isSelected}
+          />
+        </IconButton>
       </TableCell>
       <TableCell component="th" scope="row">
         {uuidPrefix(task.id)}
diff --git a/ui/src/components/RetryTasksTable.tsx b/ui/src/components/RetryTasksTable.tsx
index 1eed292..dd0939b 100644
--- a/ui/src/components/RetryTasksTable.tsx
+++ b/ui/src/components/RetryTasksTable.tsx
@@ -248,14 +248,16 @@ function RetryTasksTable(props: Props & ReduxProps) {
                 padding="checkbox"
                 classes={{ stickyHeader: classes.stickyHeaderCell }}
               >
-                <Checkbox
-                  indeterminate={numSelected > 0 && numSelected < rowCount}
-                  checked={rowCount > 0 && numSelected === rowCount}
-                  onChange={handleSelectAllClick}
-                  inputProps={{
-                    "aria-label": "select all tasks shown in the table",
-                  }}
-                />
+                <IconButton>
+                  <Checkbox
+                    indeterminate={numSelected > 0 && numSelected < rowCount}
+                    checked={rowCount > 0 && numSelected === rowCount}
+                    onChange={handleSelectAllClick}
+                    inputProps={{
+                      "aria-label": "select all tasks shown in the table",
+                    }}
+                  />
+                </IconButton>
               </TableCell>
               {columns.map((col) => (
                 <TableCell
@@ -367,12 +369,14 @@ function Row(props: RowProps) {
       onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
     >
       <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
-        <Checkbox
-          onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
-            props.onSelectChange(event.target.checked)
-          }
-          checked={props.isSelected}
-        />
+        <IconButton>
+          <Checkbox
+            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+              props.onSelectChange(event.target.checked)
+            }
+            checked={props.isSelected}
+          />
+        </IconButton>
       </TableCell>
       <TableCell component="th" scope="row">
         {uuidPrefix(task.id)}
diff --git a/ui/src/components/ScheduledTasksTable.tsx b/ui/src/components/ScheduledTasksTable.tsx
index a612f6d..204aed8 100644
--- a/ui/src/components/ScheduledTasksTable.tsx
+++ b/ui/src/components/ScheduledTasksTable.tsx
@@ -245,14 +245,16 @@ function ScheduledTasksTable(props: Props & ReduxProps) {
                 padding="checkbox"
                 classes={{ stickyHeader: classes.stickyHeaderCell }}
               >
-                <Checkbox
-                  indeterminate={numSelected > 0 && numSelected < rowCount}
-                  checked={rowCount > 0 && numSelected === rowCount}
-                  onChange={handleSelectAllClick}
-                  inputProps={{
-                    "aria-label": "select all tasks shown in the table",
-                  }}
-                />
+                <IconButton>
+                  <Checkbox
+                    indeterminate={numSelected > 0 && numSelected < rowCount}
+                    checked={rowCount > 0 && numSelected === rowCount}
+                    onChange={handleSelectAllClick}
+                    inputProps={{
+                      "aria-label": "select all tasks shown in the table",
+                    }}
+                  />
+                </IconButton>
               </TableCell>
               {columns.map((col) => (
                 <TableCell
@@ -363,12 +365,14 @@ function Row(props: RowProps) {
       onClick={() => history.push(taskDetailsPath(task.queue, task.id))}
     >
       <TableCell padding="checkbox" onClick={(e) => e.stopPropagation()}>
-        <Checkbox
-          onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
-            props.onSelectChange(event.target.checked)
-          }
-          checked={props.isSelected}
-        />
+        <IconButton>
+          <Checkbox
+            onChange={(event: React.ChangeEvent<HTMLInputElement>) =>
+              props.onSelectChange(event.target.checked)
+            }
+            checked={props.isSelected}
+          />
+        </IconButton>
       </TableCell>
       <TableCell component="th" scope="row">
         {uuidPrefix(task.id)}