diff --git a/frontend/src/app/shared/components/truncate/truncate.component.html b/frontend/src/app/shared/components/truncate/truncate.component.html
index 335c35212..4d42ab91c 100644
--- a/frontend/src/app/shared/components/truncate/truncate.component.html
+++ b/frontend/src/app/shared/components/truncate/truncate.component.html
@@ -1,5 +1,4 @@
 <span class="truncate" [style.max-width]="maxWidth ? maxWidth + 'px' : null" [style.justify-content]="textAlign" [class.inline]="inline">
-  <div class="hidden-content">{{ text }}</div>
     <ng-container *ngIf="link">
       <a [routerLink]="link" class="truncate-link">
         <ng-container *ngIf="rtl; then rtlTruncated; else ltrTruncated;"></ng-container>
@@ -12,10 +11,11 @@
 </span>
 
 <ng-template #ltrTruncated>
-
   <span class="first">{{text.slice(0,-lastChars)}}</span><span class="last-four">{{text.slice(-lastChars)}}</span>
+  <div class="hidden-content">{{ text }}</div>
 </ng-template>
 
 <ng-template #rtlTruncated>
   <span class="first">{{text.slice(lastChars)}}</span><span class="last-four">{{text.slice(0,lastChars)}}</span>
+  <div class="hidden-content">{{ text }}</div>
 </ng-template>
\ No newline at end of file
diff --git a/frontend/src/app/shared/components/truncate/truncate.component.scss b/frontend/src/app/shared/components/truncate/truncate.component.scss
index 7f79eb043..6f106a934 100644
--- a/frontend/src/app/shared/components/truncate/truncate.component.scss
+++ b/frontend/src/app/shared/components/truncate/truncate.component.scss
@@ -39,6 +39,6 @@
 
 @media (max-width: 567px) {
   .hidden-content {
-    max-width: 150px;
+    max-width: 150px !important;
   }
 }