Fixing the horizonal and vertical extra scroll bar issue

Signed-off-by: Sunish Sheth <sunishsheth2009@gmail.com>
mlflow · Dec 13, 2021 · 28a25ff · 28a25ff
1 parent c630d6d
commit 28a25ff
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 4 deletions.
diff --git a/mlflow/server/js/src/experiment-tracking/components/ExperimentRunsTableCompactView.js b/mlflow/server/js/src/experiment-tracking/components/ExperimentRunsTableCompactView.js
@@ -421,7 +421,7 @@ export class ExperimentRunsTableCompactView extends React.Component {
     return (
       <div
         id='autosizer-container'
-        className='runs-table-flex-container'
+        className='runs-table-flex-container compact-view-table-container'
         data-test-id='compact-runs-table-view'
       >
         <AutoSizer>

diff --git a/mlflow/server/js/src/experiment-tracking/components/ExperimentRunsTableMultiColumnView2.js b/mlflow/server/js/src/experiment-tracking/components/ExperimentRunsTableMultiColumnView2.js
@@ -522,6 +522,7 @@ export class ExperimentRunsTableMultiColumnView2 extends React.Component {
           defaultColDef={defaultColDef}
           columnDefs={this.state.columnDefs}
           rowData={this.getRowData()}
+          domLayout='autoHeight'
           modules={[Grid, ClientSideRowModelModule]}
           rowSelection='multiple'
           onGridReady={this.handleGridReady}

diff --git a/mlflow/server/js/src/experiment-tracking/components/ExperimentView.css b/mlflow/server/js/src/experiment-tracking/components/ExperimentView.css
@@ -328,11 +328,13 @@ span.error-message {
     flex: 1 1 auto;
     flex-direction: column;
     display: flex;
-    min-height: 800px;
-    overflow-x: scroll;
     border-radius: 4px;
 }
 
+.compact-view-table-container {
+    min-height: 800px;
+}
+
 .ExperimentView-runs {
     padding-top: 5px;
 }
@@ -396,7 +398,6 @@ span.error-message {
 
 .ExperimentView .multi-column-view {
     width: 100%;
-    height: 700px;
     margin-bottom: 50px;
 }