diff --git a/src/vs/editor/contrib/suggest/suggestWidget.ts b/src/vs/editor/contrib/suggest/suggestWidget.ts
index dd45488da329e..8aa64e00ed2a9 100644
--- a/src/vs/editor/contrib/suggest/suggestWidget.ts
+++ b/src/vs/editor/contrib/suggest/suggestWidget.ts
@@ -825,7 +825,7 @@ export class SuggestWidget implements IDisposable {
 
 	private _positionDetails(): void {
 		if (this._isDetailsVisible()) {
-			this._details.placeAtAnchor(this.element.domNode);
+			this._details.placeAtAnchor(this.element.domNode, this._contentWidget.getPosition()?.preference[0] === ContentWidgetPositionPreference.BELOW);
 		}
 	}
 
diff --git a/src/vs/editor/contrib/suggest/suggestWidgetDetails.ts b/src/vs/editor/contrib/suggest/suggestWidgetDetails.ts
index ac1c14ae8c3b5..b5e9cad6a46f8 100644
--- a/src/vs/editor/contrib/suggest/suggestWidgetDetails.ts
+++ b/src/vs/editor/contrib/suggest/suggestWidgetDetails.ts
@@ -262,6 +262,7 @@ export class SuggestDetailsOverlay implements IOverlayWidget {
 
 	private _added: boolean = false;
 	private _anchorBox?: dom.IDomNodePagePosition;
+	private _preferAlignAtTop: boolean = true;
 	private _userSize?: dom.Dimension;
 	private _topLeft?: TopLeftPosition;
 
@@ -315,7 +316,7 @@ export class SuggestDetailsOverlay implements IOverlayWidget {
 
 		this._disposables.add(this.widget.onDidChangeContents(() => {
 			if (this._anchorBox) {
-				this._placeAtAnchor(this._anchorBox, this._userSize ?? this.widget.size);
+				this._placeAtAnchor(this._anchorBox, this._userSize ?? this.widget.size, this._preferAlignAtTop);
 			}
 		}));
 	}
@@ -361,13 +362,14 @@ export class SuggestDetailsOverlay implements IOverlayWidget {
 		}
 	}
 
-	placeAtAnchor(anchor: HTMLElement) {
+	placeAtAnchor(anchor: HTMLElement, preferAlignAtTop: boolean) {
 		const anchorBox = dom.getDomNodePagePosition(anchor);
 		this._anchorBox = anchorBox;
-		this._placeAtAnchor(this._anchorBox, this._userSize ?? this.widget.size);
+		this._preferAlignAtTop = preferAlignAtTop;
+		this._placeAtAnchor(this._anchorBox, this._userSize ?? this.widget.size, preferAlignAtTop);
 	}
 
-	_placeAtAnchor(anchorBox: dom.IDomNodePagePosition, size: dom.Dimension) {
+	_placeAtAnchor(anchorBox: dom.IDomNodePagePosition, size: dom.Dimension, preferAlignAtTop: boolean) {
 		const bodyBox = dom.getClientArea(document.body);
 
 		const info = this.widget.getLayoutInfo();
@@ -416,12 +418,22 @@ export class SuggestDetailsOverlay implements IOverlayWidget {
 			height = maxHeight;
 		}
 		let maxSize: dom.Dimension;
-		if (height <= placement.maxSizeTop.height) {
-			alignAtTop = true;
-			maxSize = placement.maxSizeTop;
+		if (preferAlignAtTop) {
+			if (height <= placement.maxSizeTop.height) {
+				alignAtTop = true;
+				maxSize = placement.maxSizeTop;
+			} else {
+				alignAtTop = false;
+				maxSize = placement.maxSizeBottom;
+			}
 		} else {
-			alignAtTop = false;
-			maxSize = placement.maxSizeBottom;
+			if (height <= placement.maxSizeBottom.height) {
+				alignAtTop = false;
+				maxSize = placement.maxSizeBottom;
+			} else {
+				alignAtTop = true;
+				maxSize = placement.maxSizeTop;
+			}
 		}
 
 		this._applyTopLeft({ left: placement.left, top: alignAtTop ? placement.top : bottom - height });