diff --git a/src/vs/base/browser/ui/dialog/dialog.css b/src/vs/base/browser/ui/dialog/dialog.css
index bdca8bcfd7424..69024d42a3e1e 100644
--- a/src/vs/base/browser/ui/dialog/dialog.css
+++ b/src/vs/base/browser/ui/dialog/dialog.css
@@ -163,6 +163,19 @@
 	margin: 4px 5px;
 }
 
+.monaco-dialog-box > .dialog-buttons-row > .dialog-buttons > .monaco-button-dropdown:focus-within {
+	/**
+	 * This is a trick to make the focus outline appear on the entire
+	 * container of the dropdown button to ensure the dialog box looks
+	 * consistent to dialogs without dropdown buttons.
+	 */
+	outline-offset: 2px !important;
+	outline-width: 1px;
+	outline-style: solid;
+	outline-color: var(--vscode-focusBorder);
+	border-radius: 2px;
+}
+
 .monaco-dialog-box > .dialog-buttons-row > .dialog-buttons > .monaco-button-dropdown > .monaco-text-button {
 	padding-left: 10px;
 	padding-right: 10px;