diff --git a/packages/main/cypress/specs/ExpandableText.cy.tsx b/packages/main/cypress/specs/ExpandableText.cy.tsx
index 18ef33e4e8cb..06a2e66a6c97 100644
--- a/packages/main/cypress/specs/ExpandableText.cy.tsx
+++ b/packages/main/cypress/specs/ExpandableText.cy.tsx
@@ -223,6 +223,76 @@ describe("ExpandableText", () => {
 		});
 	});
 
+	describe("CSS Inheritance", () => {
+		it("Text element inherits white-space from host", () => {
+			const text = "This is a very long text that should be displayed";
+
+			cy.mount(
+				<div style={{ whiteSpace: "pre-wrap" }}>
+					<ExpandableText text={text} maxCharacters={9999}></ExpandableText>
+				</div>
+			);
+
+			cy.get("[ui5-expandable-text]")
+				.shadow()
+				.find(".ui5-exp-text-text")
+				.should("have.css", "white-space", "pre-wrap")
+				.and("have.css", "display", "inline");
+		});
+
+		it("Text element inherits white-space 'nowrap' from host", () => {
+			const text = "This is a very long text that should be displayed";
+
+			cy.mount(
+				<div style={{ whiteSpace: "nowrap" }}>
+					<ExpandableText text={text} maxCharacters={9999}></ExpandableText>
+				</div>
+			);
+
+			cy.get("[ui5-expandable-text]")
+				.shadow()
+				.find(".ui5-exp-text-text")
+				.should("have.css", "white-space", "nowrap");
+		});
+
+		it("Popover and popover text inherit white-space, font-family, and font-size from host", () => {
+			const text = "This is a very long text that should be displayed";
+			const maxCharacters = 5;
+
+			cy.mount(
+				<div style={{ whiteSpace: "pre-line" }}>
+					<ExpandableText text={text} maxCharacters={maxCharacters} overflowMode="Popover"></ExpandableText>
+				</div>
+			);
+
+			cy.get("[ui5-expandable-text]").shadow().as("expTextShadow");
+
+			cy.get("@expTextShadow")
+				.find(".ui5-exp-text-toggle")
+				.realClick();
+
+			cy.get("[ui5-expandable-text]")
+				.invoke("css", "font-family")
+				.then(hostFontFamily => {
+					cy.get("[ui5-expandable-text]")
+						.invoke("css", "font-size")
+						.then(hostFontSize => {
+							cy.get("@expTextShadow")
+								.find(".ui5-exp-text-popover")
+								.should("have.css", "white-space", "pre-line")
+								.and("have.css", "font-family", hostFontFamily as unknown as string)
+								.and("have.css", "font-size", hostFontSize as unknown as string);
+
+							cy.get("@expTextShadow")
+								.find(".ui5-exp-text-popover-text")
+								.should("have.css", "white-space", "pre-line")
+								.and("have.css", "font-family", hostFontFamily as unknown as string)
+								.and("have.css", "font-size", hostFontSize as unknown as string);
+						});
+				});
+		});
+	});
+
 	describe("Empty Indicator", () => {
 		it("Should display empty indicator if text is empty and emptyIndicatorMode=On", () => {
 			cy.mount(<ExpandableText text="" emptyIndicatorMode="On"></ExpandableText>);
diff --git a/packages/main/src/ExpandableTextTemplate.tsx b/packages/main/src/ExpandableTextTemplate.tsx
index eee3966f882e..22c0e6a0d329 100644
--- a/packages/main/src/ExpandableTextTemplate.tsx
+++ b/packages/main/src/ExpandableTextTemplate.tsx
@@ -37,7 +37,7 @@ export default function ExpandableTextTemplate(this: ExpandableText) {
 						class="ui5-exp-text-popover"
 						onClose={this._handlePopoverClose}
 					>
-						<Text id="popover-text">{this.text}</Text>
+						<Text class="ui5-exp-text-popover-text" id="popover-text">{this.text}</Text>
 						<div
 							slot="footer"
 							class="ui5-exp-text-footer"
diff --git a/packages/main/src/themes/ExpandableText.css b/packages/main/src/themes/ExpandableText.css
index 063074bd6054..478cddcd04b0 100644
--- a/packages/main/src/themes/ExpandableText.css
+++ b/packages/main/src/themes/ExpandableText.css
@@ -11,6 +11,7 @@
 
 .ui5-exp-text-text {
 	display: inline;
+	white-space: inherit;
 }
 
 .ui5-exp-text-text,
@@ -24,6 +25,13 @@
 	color: inherit;
 }
 
+.ui5-exp-text-popover,
+.ui5-exp-text-popover-text {
+	white-space: inherit;
+	font-family: inherit;
+	font-size: inherit;
+}
+
 .ui5-exp-text-popover::part(content) {
 	padding-inline: 1rem;
 }
diff --git a/packages/main/test/pages/ExpandableText.html b/packages/main/test/pages/ExpandableText.html
index b462c0147c88..479a925d05fe 100644
--- a/packages/main/test/pages/ExpandableText.html
+++ b/packages/main/test/pages/ExpandableText.html
@@ -27,10 +27,10 @@ <h3>max-characters=9999</h3>
 
 	<h3>max-characters=0</h3>
 	<ui5-expandable-text max-characters="0" text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac risus nec lorem pretium fringilla. Sed non eros nec nisl vehicula finibus. Suspendisse potenti. Quisque nec odio et est pharetra semper. Nullam nec ligula in risus laoreet pulvinar. Nullam et turpis ac eros viverra facilisis. Nullam et turpis ac eros viverra facilisis"></ui5-expandable-text>
-	
+
 	<h3>max-characters=-1</h3>
 	<ui5-expandable-text max-characters="-1" text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac risus nec lorem pretium fringilla. Sed non eros nec nisl vehicula finibus. Suspendisse potenti. Quisque nec odio et est pharetra semper. Nullam nec ligula in risus laoreet pulvinar. Nullam et turpis ac eros viverra facilisis. Nullam et turpis ac eros viverra facilisis"></ui5-expandable-text>
-	
+
 	<h3>overflowMode=Popover</h3>
 	<ui5-expandable-text max-characters="150" overflow-mode="Popover" text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ac risus nec lorem pretium fringilla. Sed non eros nec nisl vehicula finibus. Suspendisse potenti. Quisque nec odio et est pharetra semper. Nullam nec ligula in risus laoreet pulvinar. Nullam et turpis ac eros viverra facilisis. Nullam et turpis ac eros viverra facilisis"></ui5-expandable-text>
 
@@ -49,4 +49,18 @@ <h3>Off, with Text</h3>
 
 	<h3>RTL</h3>
 	<ui5-expandable-text dir="rtl" text="וְאָהַבְתָּ אֵת יְיָ | אֱלֹהֶיךָ, בְּכָל-לְבָֽבְךָ, וּבְכָל-נַפְשְׁךָ, וּבְכָל-מְאֹדֶֽךָ. וְהָיוּ הַדְּבָרִים הָאֵלֶּה, אֲשֶׁר | אָֽנֹכִי מְצַוְּךָ" max-characters="50"></ui5-expandable-text>
+
+	<h2>Whitespaces</h2>
+	<h3>overflowMode=Inline</h3>
+	<ui5-expandable-text style="white-space: break-spaces" text="Simple
+
+	text"></ui5-expandable-text>
+
+	<h3>overflowMode=Popover</h3>
+	<ui5-expandable-text style="white-space: break-spaces; font-size: 20px" overflow-mode="Popover" text="Lorem ipsum dolor sit
+
+	 amet, consectetur adipiscing elit.
+
+	  Donec ac risus nec lorem pretium fringilla. Sed non eros nec nisl vehicula finibus. Suspendisse potenti. Quisque nec odio et est pharetra semper. Nullam nec ligula in risus laoreet pulvinar. Nullam et turpis ac eros viverra facilisis. Nullam et turpis ac eros viverra facilisis"></ui5-expandable-text>
+</body>
 </html>