diff --git a/app/Widgets/ChatActions/_chatactions_message.tpl b/app/Widgets/ChatActions/_chatactions_message.tpl
index 4e6763eb6..5510d176c 100644
--- a/app/Widgets/ChatActions/_chatactions_message.tpl
+++ b/app/Widgets/ChatActions/_chatactions_message.tpl
@@ -20,7 +20,7 @@
         </li>
         <li class="reactions">
             <div>
-                <p>{loop="$message->reactions->groupBy('emoji')"}<a class="chip" href="#">{autoescape="off"}{$key|addEmojis:true}{/autoescape}{$value->implode('truename', ', ')}</a>{/loop}</p>
+                <p>{loop="$message->reactions->groupBy('emoji')"}<a class="chip" href="#" title="{$value->implode('truename', ', ')}">{autoescape="off"}{$key|addEmojis:true}{/autoescape}{$value->implode('truename', ', ')}</a>{/loop}</p>
             </div>
         </li>
     </ul>
diff --git a/public/theme/css/chip.css b/public/theme/css/chip.css
index 3386bd35d..43c937a35 100644
--- a/public/theme/css/chip.css
+++ b/public/theme/css/chip.css
@@ -8,13 +8,17 @@
     color: rgb(var(--movim-font));
     background-color: rgba(var(--movim-element-action), 0.05);
     transition: background 0.3s ease;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    max-width: 80%;
 }
 
-*:not(p) > .chip:first-child {
+*:not(p)>.chip:first-child {
     margin-left: 0;
 }
 
-*:not(p) > .chip:last-child {
+*:not(p)>.chip:last-child {
     margin-right: 0;
 }