diff --git a/src-web/components/KeyboardShortcutsDialog.tsx b/src-web/components/KeyboardShortcutsDialog.tsx
index e9d3da3d..1e9ab1f3 100644
--- a/src-web/components/KeyboardShortcutsDialog.tsx
+++ b/src-web/components/KeyboardShortcutsDialog.tsx
@@ -3,8 +3,8 @@ import { HotKeyList } from './core/HotKeyList';
 
 export function KeyboardShortcutsDialog() {
   return (
-    <div className="h-full w-full pb-2">
-      <HotKeyList hotkeys={hotkeyActions} />
+    <div className="grid h-full">
+      <HotKeyList hotkeys={hotkeyActions} className="pb-6" />
     </div>
   );
 }
diff --git a/src-web/components/core/HotKeyList.tsx b/src-web/components/core/HotKeyList.tsx
index 1bb163ba..93b0dc85 100644
--- a/src-web/components/core/HotKeyList.tsx
+++ b/src-web/components/core/HotKeyList.tsx
@@ -13,7 +13,7 @@ interface Props {
 export const HotKeyList = ({ hotkeys, bottomSlot, className }: Props) => {
   return (
     <div className={classNames(className, 'h-full flex items-center justify-center')}>
-      <div className="px-4 grid gap-2 grid-cols-[auto_auto]">
+      <div className="grid gap-2 grid-cols-[auto_auto]">
         {hotkeys.map((hotkey) => (
           <Fragment key={hotkey}>
             <HotKeyLabel className="truncate" action={hotkey} />