diff --git a/adminfront/src/features/audit/AuditLogsPage.tsx b/adminfront/src/features/audit/AuditLogsPage.tsx
index a5b845de..7707ea03 100644
--- a/adminfront/src/features/audit/AuditLogsPage.tsx
+++ b/adminfront/src/features/audit/AuditLogsPage.tsx
@@ -27,6 +27,10 @@ import {
   TableHeader,
   TableRow,
 } from "../../components/ui/table";
+import {
+  commonTableShellClass,
+  commonTableViewportClass,
+} from "../../../../common/ui/table";
 import type { AuditLog } from "../../lib/adminApi";
 import { fetchAuditLogs } from "../../lib/adminApi";
 import { t } from "../../lib/i18n";
@@ -254,8 +258,8 @@ function AuditLogsPage() {
               ))
             )}
           </div>
-          <div className="flex-1 rounded-md border overflow-hidden flex flex-col">
-            <div className="flex-1 overflow-auto relative custom-scrollbar">
+          <div className={commonTableShellClass}>
+            <div className={commonTableViewportClass}>
               <Table className="table-fixed">
                 <TableHeader className="sticky top-0 z-10 bg-secondary shadow-sm">
                   <TableRow>
diff --git a/devfront/src/features/audit/AuditLogsPage.tsx b/devfront/src/features/audit/AuditLogsPage.tsx
index 61dced27..941690dd 100644
--- a/devfront/src/features/audit/AuditLogsPage.tsx
+++ b/devfront/src/features/audit/AuditLogsPage.tsx
@@ -28,6 +28,10 @@ import {
   TableHeader,
   TableRow,
 } from "../../components/ui/table";
+import {
+  commonTableShellClass,
+  commonTableViewportClass,
+} from "../../../../common/ui/table";
 import type { DevAuditLog } from "../../lib/devApi";
 import { fetchDevAuditLogs } from "../../lib/devApi";
 import { t } from "../../lib/i18n";
@@ -280,8 +284,10 @@ function AuditLogsPage() {
                 : ""
             }
           >
-            <Table className="table-fixed">
-              <TableHeader>
+            <div className={commonTableShellClass}>
+              <div className={commonTableViewportClass}>
+                <Table className="table-fixed">
+                  <TableHeader className="sticky top-0 z-10 bg-secondary shadow-sm">
                 <TableRow>
                   <TableHead className="w-[190px]">
                     {t("ui.dev.audit.table.time", "Time")}
@@ -430,7 +436,9 @@ function AuditLogsPage() {
                   })
                 )}
               </TableBody>
-            </Table>
+                </Table>
+              </div>
+            </div>
           </div>
 
           {query.hasNextPage ? (