diff --git a/src/renderer/assets/styles/components/annotations.scss b/src/renderer/assets/styles/components/annotations.scss
index f71d198ce..cce8e585d 100644
--- a/src/renderer/assets/styles/components/annotations.scss
+++ b/src/renderer/assets/styles/components/annotations.scss
@@ -650,7 +650,7 @@
       >div {
         display: inherit;
         align-items: center;
-        gap: 5px;
+        overflow: hidden;
 
         button {
           padding: 5px;
diff --git a/src/renderer/reader/components/ReaderMenu.tsx b/src/renderer/reader/components/ReaderMenu.tsx
index 20eeb88f4..e708b32ca 100644
--- a/src/renderer/reader/components/ReaderMenu.tsx
+++ b/src/renderer/reader/components/ReaderMenu.tsx
@@ -595,7 +595,7 @@ const AnnotationCard: React.FC<{ timestamp: number, annotation: IAnnotationState
                     ?
                     <div>
                         <SVG ariaHidden svg={AvatarIcon} />
-                        <p>{creatorName}</p>
+                        <p style={{overflow: "hidden", textOverflow: "ellipsis", padding: "0"}} title={creatorName}>{creatorName}</p>
                     </div>
                     : <></>
                 }