diff --git a/app/assets/javascripts/performance_bar/components/detailed_metric.vue b/app/assets/javascripts/performance_bar/components/detailed_metric.vue
index d4881f07972..db8a0055acd 100644
--- a/app/assets/javascripts/performance_bar/components/detailed_metric.vue
+++ b/app/assets/javascripts/performance_bar/components/detailed_metric.vue
@@ -70,6 +70,7 @@ export default {
             <td
               v-for="key in keys"
               :key="key"
+              class="break-word"
             >
               {{ item[key] }}
             </td>
diff --git a/app/assets/stylesheets/framework/common.scss b/app/assets/stylesheets/framework/common.scss
index 37d33320445..d0dda50a835 100644
--- a/app/assets/stylesheets/framework/common.scss
+++ b/app/assets/stylesheets/framework/common.scss
@@ -446,6 +446,10 @@ img.emoji {
   opacity: .5;
 }
 
+.break-word {
+  word-wrap: break-word;
+}
+
 /** COMMON CLASSES **/
 .prepend-top-0 { margin-top: 0; }
 .prepend-top-5 { margin-top: 5px; }
diff --git a/app/assets/stylesheets/performance_bar.scss b/app/assets/stylesheets/performance_bar.scss
index 5d1a9489aad..d69b390ac27 100644
--- a/app/assets/stylesheets/performance_bar.scss
+++ b/app/assets/stylesheets/performance_bar.scss
@@ -102,8 +102,14 @@
     }
   }
 
-  .performance-bar-modal .modal-footer {
-    display: none;
+  .performance-bar-modal {
+    .modal-footer {
+      display: none;
+    }
+
+    .modal-dialog {
+      width: 860px;
+    }
   }
 }