diff --git a/src/course-home/outline-tab/LmsHtmlFragment.jsx b/src/course-home/outline-tab/LmsHtmlFragment.jsx
index 778e7d79d8..85e3fb4fa5 100644
--- a/src/course-home/outline-tab/LmsHtmlFragment.jsx
+++ b/src/course-home/outline-tab/LmsHtmlFragment.jsx
@@ -1,6 +1,5 @@
 import React, { useEffect, useRef } from 'react';
 import PropTypes from 'prop-types';
-
 import { getConfig } from '@edx/frontend-platform';
 
 const LmsHtmlFragment = ({
@@ -10,14 +9,21 @@ const LmsHtmlFragment = ({
   ...rest
 }) => {
   const direction = document.documentElement?.getAttribute('dir') || 'ltr';
+
+  const getCssUrl = () => {
+    const baseUrl = getConfig().BASE_URL;
+    const standardizedBaseUrl = /^https?:\/\//.test(baseUrl) ? baseUrl : `https://${baseUrl}`;
+    return `${standardizedBaseUrl}/static/LmsHtmlFragment.css`;
+  };
+
   const wholePage = `
-    <html dir="${direction}">
+    <html dir='${direction}'>
       <head>
-        <base href="${getConfig().LMS_BASE_URL}" target="_parent">
+        <base href='${getConfig().LMS_BASE_URL}' target='_parent'>
         <link rel="stylesheet" href="/static/${getConfig().LEGACY_THEME_NAME ? `${getConfig().LEGACY_THEME_NAME}/` : ''}css/bootstrap/lms-main.css">
-        <link rel="stylesheet" type="text/css" href="${getConfig().BASE_URL}/static/LmsHtmlFragment.css">
+        <link rel='stylesheet' type='text/css' href='${getCssUrl()}'>
       </head>
-      <body class="${className}">${html}</body>
+      <body class='${className}'>${html}</body>
       <script>
         const resizer = new ResizeObserver(() => {
           window.parent.postMessage({type: 'lmshtmlfragment.resize'}, '*');
@@ -28,6 +34,7 @@ const LmsHtmlFragment = ({
   `;
 
   const iframe = useRef(null);
+
   function resetIframeHeight() {
     if (iframe?.current?.contentWindow?.document?.body) {
       iframe.current.height = iframe.current.contentWindow.document.body.parentNode.scrollHeight;
@@ -42,6 +49,10 @@ const LmsHtmlFragment = ({
       }
     }
     global.addEventListener('message', receiveMessage);
+
+    return () => {
+      global.removeEventListener('message', receiveMessage);
+    };
   }, []);
 
   return (
