Center table only when in card body; undo flex-basis

Author: cpsievert

js/dataframe/index.tsx

@@ -484,8 +484,6 @@ export class ShinyDataFrameOutput extends HTMLElement {
 
     const myDiv = document.createElement("div");
     myDiv.classList.add("html-fill-container", "html-fill-item");
-    myDiv.style.marginLeft = "auto";
-    myDiv.style.marginRight = "auto";
     target.appendChild(myDiv);
 
     this.reactRoot = createRoot(myDiv);

js/dataframe/styles.scss

@@ -41,7 +41,6 @@
   height: 500px;
   &:not(.scrolling) {
     height: auto;
-    flex-basis: 500px;
   }
 
   > table {
@@ -203,3 +202,9 @@
     }
   }
 }
+
+/* Center the table when inside of a card */
+.card-body .shiny-data-grid {
+  margin-left: auto;
+  margin-right: auto;
+}