From 50c6f1927a110be3b75db964b101b0683d8c5958 Mon Sep 17 00:00:00 2001
From: Paul Marbach <fastfrwrd@gmail.com>
Date: Thu, 10 Jul 2025 10:04:38 -0400
Subject: [PATCH] [release-11.6.4] fix: percentage-based heights were not
 applied in updated scrollable iframe container (#107188)

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%',
   }),
 });