diff --git a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue
index a2fd77b5055..e5bbc3e7055 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/AutocompleteItem.vue
@@ -36,7 +36,7 @@
       size="xlarge"
       :accessible-label="$gettext('User')"
     />
-    <div class="files-collaborators-autocomplete-user-text">
+    <div class="files-collaborators-autocomplete-user-text oc-text-truncate">
       <span class="oc-text-bold files-collaborators-autocomplete-username" v-text="item.label" />
       <span
         v-if="item.value.shareWithAdditionalInfo"
diff --git a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.vue b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.vue
index 36861a1c635..c0194fa9b34 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/RecipientContainer.vue
@@ -107,9 +107,14 @@ export default {
 }
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 .files-share-invite-recipient {
   margin: 4px 2px 0;
   padding: 0 0.25em;
+  overflow-wrap: anywhere;
+
+  .oc-recipient-avatar {
+    min-width: 16.8px;
+  }
 }
 </style>