fix: added word-break css property solution

Author: jr-rk

src/app/item-page/edit-item-page/item-bitstreams/item-edit-bitstream-bundle/item-edit-bitstream-bundle.component.html

@@ -86,22 +86,20 @@
 
             <th class="bitstream-name row-element {{ columnSizes.columns[0].buildClasses() }}"
                 scope="row" id="{{ entry.nameStripped }}" headers="{{ bundleName }} name">
-              <div class="d-flex align-items-center">
-                <div class="drag-handle text-muted p-1 mr-2" tabindex="0" cdkDragHandle
+                <div class="drag-handle text-muted float-left p-1 mr-2" tabindex="0" cdkDragHandle
                      (keydown.enter)="select($event, entry)" (keydown.space)="select($event, entry)" (click)="select($event, entry)">
                   <i class="fas fa-grip-vertical fa-fw"
                      [title]="'item.edit.bitstreams.edit.buttons.drag' | translate"></i>
                 </div>
-                <span class="flex-grow-1 bitstream-name-text" [title]="entry.name">{{ entry.name }}</span>
-              </div>
+                <span class="dont-break-out">{{ entry.name }}</span>
             </th>
             <td class="row-element {{ columnSizes.columns[1].buildClasses() }}"
                 headers="{{ entry.nameStripped }} {{ bundleName }} description">
-              {{ entry.description }}
+              <span class="dont-break-out">{{ entry.description }}</span>
             </td>
             <td class="row-element {{ columnSizes.columns[2].buildClasses() }}"
                 headers="{{ entry.nameStripped }} {{ bundleName }} format">
-              {{ (entry.format | async)?.shortDescription }}
+              <span class="dont-break-out">{{ (entry.format | async)?.shortDescription }}</span>
             </td>
             <td class="row-element {{ columnSizes.columns[3].buildClasses() }}"
                 headers="{{ entry.nameStripped }} {{ bundleName }} actions">

src/app/item-page/edit-item-page/item-bitstreams/item-edit-bitstream-bundle/item-edit-bitstream-bundle.component.scss

@@ -19,9 +19,8 @@
   font-weight: normal;
 }
 
-.bitstream-name-text {
-  width: 0;
-  overflow: auto;
+.dont-break-out {
+  word-break: break-word;
 }
 
 .table {