From a39a354ff5cc2d624ec96c3621ff436a3225c4bc Mon Sep 17 00:00:00 2001
From: Paul Marbach <paul.marbach@grafana.com>
Date: Mon, 23 Jun 2025 11:58:30 -0400
Subject: [PATCH] fix: percentage-based heights were not applied in updated
 scrollable iframe container

---
 public/app/plugins/panel/text/TextPanel.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/public/app/plugins/panel/text/TextPanel.tsx b/public/app/plugins/panel/text/TextPanel.tsx
index a98c75b9707..070dc94a8a5 100644
--- a/public/app/plugins/panel/text/TextPanel.tsx
+++ b/public/app/plugins/panel/text/TextPanel.tsx
@@ -1,4 +1,4 @@
-import { css } from '@emotion/css';
+import { css, cx } from '@emotion/css';
 import DangerouslySetHtmlContent from 'dangerously-set-html-content';
 import { useState } from 'react';
 import { useDebounce } from 'react-use';
@@ -56,7 +56,7 @@ export function TextPanel(props: Props) {
         <DangerouslySetHtmlContent
           allowRerender
           html={processed.content}
-          className="markdown-html"
+          className={cx('markdown-html', styles.markdownHtml)}
           data-testid="TextPanel-converted-content"
         />
       </ScrollContainer>
@@ -103,5 +103,9 @@ const getStyles = (theme: GrafanaTheme2) => ({
   containStrict: css({
     contain: 'strict',
     height: '100%',
+    display: 'flex',
+  }),
+  markdownHtml: css({
+    height: '100%',
   }),
 });