diff --git a/src/components/hub-compass-map/hub-compass-map.css b/src/components/hub-compass-map/hub-compass-map.css
index 5f31fcb..f29dd8c 100644
--- a/src/components/hub-compass-map/hub-compass-map.css
+++ b/src/components/hub-compass-map/hub-compass-map.css
@@ -4,11 +4,20 @@
 #mapDiv {
   height: 100%;
   width: 100%;
+  flex-grow: 3;
 }
 
+#tableDiv {
+  flex-grow: 1;
+  
+}
+.table {
+  height: 100%;
+  min-height: 300px;
+}
 #mapWrapper {
   display: flex;
   flex-direction: column;
   height: 100%;
   width: 100%;
-}
\ No newline at end of file
+}
diff --git a/src/components/hub-compass-map/hub-compass-map.tsx b/src/components/hub-compass-map/hub-compass-map.tsx
index 8c4cc10..4a9259a 100644
--- a/src/components/hub-compass-map/hub-compass-map.tsx
+++ b/src/components/hub-compass-map/hub-compass-map.tsx
@@ -408,7 +408,7 @@ export class HubCompassMap {
   }
   renderTableView(datasetId:string) {
     console.debug("renderTableView: ", {datasetId, datasetEls: this.datasetEls})
-    const output =<calcite-tab><div class="table" ref={(el) => {this.datasetEls[datasetId].view = el}}></div></calcite-tab>;
+    const output =<calcite-tab class="table" ><div ref={(el) => {this.datasetEls[datasetId].view = el}}></div></calcite-tab>;
     return output
   }
 }
diff --git a/src/index.html b/src/index.html
index 4c51038..83eb377 100644
--- a/src/index.html
+++ b/src/index.html
@@ -103,7 +103,7 @@
     componentEl.datasetIds = [];
     componentEl.showLayers = true;
     componentEl.showSearch = true;
-    componentEl.showTable = false;
+    componentEl.showTable = true;
 
     function moveMap(center, zoom) {
       componentEl.center = center;