diff --git a/src/components/charts/chart.ts b/src/components/charts/chart.ts
index ca2cad07..ef5dcc8f 100644
--- a/src/components/charts/chart.ts
+++ b/src/components/charts/chart.ts
@@ -737,13 +737,8 @@ export default class AstraChart extends ClassifiedElement {
     // Line break (double space followed by a newline)
     markdown = markdown.replace(/  \n/g, '<br>')
 
-    return html`<div
-      variant=${variant}
-      style=${`display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; font-family: Inter, sans-serif;`}
-      class="flex-1 self-start text-neutral-900 dark:text-neutral-100"
-    >
-      ${unsafeHTML(markdown)}
-    </div>`
+    // add `truncate` here to get ellipsis working, but at the cost of losing visibility of most of the content
+    return html`<div variant=${variant} class="flex-1 self-start text-neutral-900 dark:text-neutral-100">${unsafeHTML(markdown)}</div>`
   }
 
   private renderAsSingleValue() {
diff --git a/src/components/charts/composed.ts b/src/components/charts/composed.ts
index bae70c0e..28cbb5e8 100644
--- a/src/components/charts/composed.ts
+++ b/src/components/charts/composed.ts
@@ -201,14 +201,16 @@ export default class AstraComposedChart extends AstraChart {
       >
         <div
           id="composed-chart"
-          class=${`dark:text-neutral-100 text-neutral-950 h-full flex flex-col ${layer?.type === 'table' ? '' : 'p-5'} gap-4 rounded-lg bg-white dark:bg-black group/actions`}
+          class=${`dark:text-neutral-100 text-neutral-950 h-full ${layer?.type === 'table' ? '' : 'p-5'} gap-4 rounded-lg bg-white dark:bg-black group/actions`}
         >
-          ${layer?.type === 'single_value'
-            ? // Single value charts show the highlights at the bottom of the card
-              html`${headerSection} ${chartSection}` // ${highlightSection} - Until more meaningful highlights are available, disabling for single value
-            : // All other charts show the highlights above the chart rendering
-              html`<div class=${`${layer?.type === 'table' ? 'p-5' : ''}`}>${headerSection} ${highlightSection}</div>
-                ${chartSection}`}
+          <div class=${`flex flex-col flex-1 h-full ${layer?.type === 'text' ? 'overflow-hidden' : ''}`}>
+            ${layer?.type === 'single_value'
+              ? // Single value charts show the highlights at the bottom of the card
+                html`${headerSection} ${chartSection}` // ${highlightSection} - Until more meaningful highlights are available, disabling for single value
+              : // All other charts show the highlights above the chart rendering
+                html`<div class=${`${layer?.type === 'table' ? 'p-5' : ''}`}>${headerSection} ${highlightSection}</div>
+                  ${chartSection}`}
+          </div>
         </div>
       </div>
     `