diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index 8088e279233c..9ad658149aec 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -4103,10 +4103,15 @@ button.module-image__border-overlay:focus {
     margin-bottom: 16px;
   }
 
+  &__avatar-and-name {
+    display: flex;
+    align-items: center;
+    max-width: 172px;
+  }
+
   &__name {
     display: inline-block;
     margin-inline-start: 8px;
-    max-width: 130px;
     overflow: hidden;
     text-overflow: ellipsis;
     vertical-align: middle;
diff --git a/ts/components/CallingParticipantsList.tsx b/ts/components/CallingParticipantsList.tsx
index a575cb3ec9d9..eb2d77dd1925 100644
--- a/ts/components/CallingParticipantsList.tsx
+++ b/ts/components/CallingParticipantsList.tsx
@@ -107,7 +107,7 @@ export const CallingParticipantsList = React.memo(
                     //   participants who have joined on multiple devices.
                     key={index}
                   >
-                    <div>
+                    <div className="module-calling-participants-list__avatar-and-name">
                       <Avatar
                         acceptedMessageRequest={
                           participant.acceptedMessageRequest