diff --git a/packages/block-editor/src/components/link-control/style.scss b/packages/block-editor/src/components/link-control/style.scss
index e6976e47a16c74..15a271dd92e519 100644
--- a/packages/block-editor/src/components/link-control/style.scss
+++ b/packages/block-editor/src/components/link-control/style.scss
@@ -124,7 +124,7 @@ $preview-image-height: 140px;
 .block-editor-link-control__search-item {
 	position: relative;
 	display: flex;
-	align-items: center;
+	align-items: flex-start; // when link text is very long it is important this indicator remains visible and thus should be aligned top.
 	font-size: $default-font-size;
 	cursor: pointer;
 	background: $white;
@@ -168,7 +168,12 @@ $preview-image-height: 140px;
 		align-items: flex-start;
 		margin-right: $grid-unit-10;
 		overflow: hidden;
-		white-space: nowrap;
+
+		// Force text to wrap to improve UX when encountering long lines
+		// of text, particular those with no spaces.
+		// See: https://github.com/WordPress/gutenberg/issues/33586#issuecomment-888921188
+		white-space: pre-wrap;
+		word-wrap: break-word;
 	}
 
 	&.is-preview .block-editor-link-control__search-item-header {