diff --git a/packages/grafana-ui/src/components/Table/JSONViewCell.tsx b/packages/grafana-ui/src/components/Table/JSONViewCell.tsx
index 7989fd26d7d..b642be28efc 100644
--- a/packages/grafana-ui/src/components/Table/JSONViewCell.tsx
+++ b/packages/grafana-ui/src/components/Table/JSONViewCell.tsx
@@ -21,7 +21,7 @@ export const JSONViewCell: FC<TableCellProps> = props => {
   return (
     <div className={cx(txt, tableStyles.tableCell)}>
       <Tooltip placement="auto" content={content} theme={'info'}>
-        <span>{displayValue}</span>
+        <div className={tableStyles.overflow}>{displayValue}</div>
       </Tooltip>
     </div>
   );
diff --git a/packages/grafana-ui/src/components/Table/styles.ts b/packages/grafana-ui/src/components/Table/styles.ts
index c7b08c0f3d9..4c3a5254b72 100644
--- a/packages/grafana-ui/src/components/Table/styles.ts
+++ b/packages/grafana-ui/src/components/Table/styles.ts
@@ -17,6 +17,7 @@ export interface TableStyles {
   row: string;
   theme: GrafanaTheme;
   resizeHandle: string;
+  overflow: string;
 }
 
 export const getTableStyles = stylesFactory(
@@ -92,6 +93,10 @@ export const getTableStyles = stylesFactory(
         white-space: nowrap;
         overflow: hidden;
       `,
+      overflow: css`
+        overflow: hidden;
+        text-overflow: ellipsis;
+      `,
       resizeHandle: css`
         label: resizeHandle;
         cursor: col-resize !important;