Added some CSS to make cell content cut off with ellipses if a column is narrower than the content's width

1 files changed, 18 insertions, 0 deletions

diff --git a/wqflask/wqflask/static/new/css/trait_list.css b/wqflask/wqflask/static/new/css/trait_list.css
index c7249721..6d49f009 100644
--- a/wqflask/wqflask/static/new/css/trait_list.css
+++ b/wqflask/wqflask/static/new/css/trait_list.css
@@ -52,3 +52,21 @@ div.dts div.dataTables_paginate,div.dts div.dataTables_length{
     display:none
 }
 
+/* This is the important CSS */
+table.dataTable {
+    table-layout: fixed;
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+}
+
+table.dataTable th {
+    white-space: nowrap;
+    overflow: hidden;
+}
+
+table.dataTable td {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
\ No newline at end of file