diff --git a/app/features/friends/routes/friends.module.css b/app/features/friends/routes/friends.module.css
index 1f9321b4b..dd3b58731 100644
--- a/app/features/friends/routes/friends.module.css
+++ b/app/features/friends/routes/friends.module.css
@@ -13,6 +13,12 @@
 	font-weight: var(--weight-semi);
 }
 
+.userName {
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
 .friendsListHeader {
 	display: flex;
 	align-items: center;
diff --git a/app/features/friends/routes/friends.tsx b/app/features/friends/routes/friends.tsx
index a67c1803b..9bf8b14d2 100644
--- a/app/features/friends/routes/friends.tsx
+++ b/app/features/friends/routes/friends.tsx
@@ -72,7 +72,7 @@ function IncomingRequestsSection() {
 								}}
 								size="xs"
 							/>
-							<span>{request.sender.username}</span>
+							<span className={styles.userName}>{request.sender.username}</span>
 						</div>
 						<div className="stack horizontal sm">
 							<Form method="post">