diff --git a/frontend/src/container/ListOfDashboard/TableComponents/DeleteButton.styles.scss b/frontend/src/container/ListOfDashboard/TableComponents/DeleteButton.styles.scss
new file mode 100644
index 0000000000..afd7a87d22
--- /dev/null
+++ b/frontend/src/container/ListOfDashboard/TableComponents/DeleteButton.styles.scss
@@ -0,0 +1,5 @@
+.delete-modal {
+	.ant-modal-confirm-body {
+		align-items: center;
+	}
+}
diff --git a/frontend/src/container/ListOfDashboard/TableComponents/DeleteButton.tsx b/frontend/src/container/ListOfDashboard/TableComponents/DeleteButton.tsx
index 810b99a278..2791d365b8 100644
--- a/frontend/src/container/ListOfDashboard/TableComponents/DeleteButton.tsx
+++ b/frontend/src/container/ListOfDashboard/TableComponents/DeleteButton.tsx
@@ -1,3 +1,5 @@
+import './DeleteButton.styles.scss';
+
 import { DeleteOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
 import { Modal, Tooltip, Typography } from 'antd';
 import { REACT_QUERY_KEY } from 'constants/reactQueryKeys';
@@ -64,6 +66,7 @@ function DeleteButton({
 			okText: 'Delete',
 			okButtonProps: { danger: true },
 			centered: true,
+			className: 'delete-modal',
 		});
 	}, [modal, name, deleteDashboardMutation, notifications, t, queryClient]);