1 files changed, 18 insertions, 8 deletions

diff --git a/src/client/views/nodes/DataVizBox/components/Chart.scss b/src/client/views/nodes/DataVizBox/components/Chart.scss
index 50dfe7f05..a6ce0b88c 100644
--- a/src/client/views/nodes/DataVizBox/components/Chart.scss
+++ b/src/client/views/nodes/DataVizBox/components/Chart.scss
@@ -1,3 +1,4 @@
+@import '../../../global/globalCssVariables';
 .chart-container {
     display: flex;
     flex-direction: column;
@@ -6,10 +7,10 @@
     margin-top: 10px;
     overflow-y: visible;
 
-    .graph{
+    .graph {
         overflow: visible;
     }
-    .graph-title{
+    .graph-title {
         align-items: center;
         font-size: larger;
         display: flex;
@@ -29,7 +30,7 @@
         position: relative;
         margin-bottom: -35px;
     }
-    .selected-data{
+    .selected-data {
         align-items: center;
         text-align: center;
         display: flex;
@@ -44,10 +45,10 @@
             stroke-width: 2px;
         }
     }
-    
-    .histogram-bar{
+
+    .histogram-bar {
         outline: thin solid black;
-        &.hover{
+        &.hover {
             outline: 3px solid black;
             outline-offset: -3px;
         }
@@ -91,13 +92,22 @@
 .tableBox {
     display: flex;
     flex-direction: column;
+    height: calc(100% - 40px); // bcz: hack 40px is the size of the button rows
+    .table {
+        height: 100%;
+    }
 }
-.table-container{
+.table-container {
     overflow: scroll;
     margin: 5px;
     margin-left: 25px;
     margin-right: 10px;
     margin-bottom: 0;
+    tr td {
+        height: $DATA_VIZ_TABLE_ROW_HEIGHT !important; // bcz: hack.  you can't set a <tr> height directly, but you can set the height of all of it's <td>s.  So this is the height of a tableBox row.
+        padding: 0 !important;
+        vertical-align: middle !important;
+    }
 }
 .selectAll-buttons {
     display: flex;
@@ -106,4 +116,4 @@
     margin-top: 5px;
     margin-right: 10px;
     float: right;
-}
\ No newline at end of file
+}