diff --git a/src/components/page_template/page_template.tsx b/src/components/page_template/page_template.tsx
index e99361f7145..9f9b4b959f4 100644
--- a/src/components/page_template/page_template.tsx
+++ b/src/components/page_template/page_template.tsx
@@ -141,7 +141,7 @@ export const _EuiPageTemplate: FunctionComponent<EuiPageTemplateProps> = ({
     restrictWidth,
     paddingSize,
     // pageInnerId may contain colons that are parsed as pseudo-elements if not escaped
-    parent: `#${CSS.escape(pageInnerId)}`,
+    parent: `#${pageInnerId.replaceAll(':', '\\:')}`,
   });
 
   const innerPanelled = () => panelled ?? Boolean(sidebar.length > 0);