diff --git a/packages/freesewing.shared/components/mdx/highlight.js b/packages/freesewing.shared/components/mdx/highlight.js
index 51f7ef3903e..ff9194a604f 100644
--- a/packages/freesewing.shared/components/mdx/highlight.js
+++ b/packages/freesewing.shared/components/mdx/highlight.js
@@ -18,7 +18,7 @@ const Highlight = (props) => {
       <div className={`text-xs uppercase font-bold text-neutral-content mt-1 text-center border-b border-neutral-content border-opacity-25 py-1 mb-2 lg:text-sm`}>
         {names[language] ? names[language] : language}
       </div>
-      <pre className={`language-${language} hljs text-base lg:text-lg whitespace-pre-line`}>
+      <pre className={`language-${language} hljs text-base lg:text-lg whitespace-pre-wrap`}>
         {children}
       </pre>
     </div>