diff --git a/resources/js/requests/components/RequestsListing.vue b/resources/js/requests/components/RequestsListing.vue
index 586586f874..d1b3bf72ca 100644
--- a/resources/js/requests/components/RequestsListing.vue
+++ b/resources/js/requests/components/RequestsListing.vue
@@ -47,7 +47,7 @@
                 :class="{ 'pm-table-truncate': header.truncate }"
                 :style="{ maxWidth: header.width + 'px' }"
               >
-                <div v-html="sanitize(getNestedPropertyValue(row, header.field))"></div>
+                <span v-html="sanitize(getNestedPropertyValue(row, header.field))"></span>
               </div>
               <b-tooltip
                 v-if="header.truncate"
@@ -333,7 +333,7 @@ export default {
       let htmlString = '';
       for (const task of value) {
         htmlString += `
-          <div>
+          <div class="text-truncate">
             <a class="text-nowrap" href="${this.openTask(task)}">
               ${task.element_name}
             </a>
diff --git a/resources/js/tasks/components/TasksList.vue b/resources/js/tasks/components/TasksList.vue
index 922e8b8c2e..d52c0f1739 100644
--- a/resources/js/tasks/components/TasksList.vue
+++ b/resources/js/tasks/components/TasksList.vue
@@ -49,8 +49,8 @@
                 :id="`element-${rowIndex}-${colIndex}`"
                 :class="{ 'pm-table-truncate': header.truncate }"
                 :style="{ maxWidth: header.width + 'px' }"
-              >
-                <div v-html="sanitize(getNestedPropertyValue(row, header.field))"></div>
+                  >
+                <span v-html="sanitize(getNestedPropertyValue(row, header.field))"></span>
               </div>
               <b-tooltip
                 v-if="header.truncate"
@@ -290,7 +290,6 @@ export default {
       </a>`;
     },
     setupColumns() {
-      const columns = this.getColumns();
       this.tableHeaders = this.getColumns();
     },
     getColumns() {