diff --git a/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx b/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx
index bb16c7e47c97..4aa83b57dbe2 100644
--- a/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx
+++ b/website/docs/guides/markdown-features/markdown-features-code-blocks.mdx
@@ -234,6 +234,7 @@ export default MyComponent;
 ```
 ````
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx {1,4-6,11}
@@ -251,6 +252,7 @@ export default MyComponent;
 ```
 
 </BrowserWindow>
+````
 
 :::tip prefer comments
 
@@ -294,6 +296,7 @@ export default MyComponent;
 ```
 ````
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx {1,4-6,11} showLineNumbers
@@ -311,6 +314,7 @@ export default MyComponent;
 ```
 
 </BrowserWindow>
+````
 
 ## Interactive code editor {#interactive-code-editor}
 
@@ -361,6 +365,7 @@ function Clock(props) {
 
 The code block will be rendered as an interactive editor. Changes to the code will reflect on the result panel live.
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx live
@@ -387,6 +392,7 @@ function Clock(props) {
 ```
 
 </BrowserWindow>
+````
 
 ### Imports {#imports}
 
@@ -435,6 +441,7 @@ export default ReactLiveScope;
 
 The `ButtonExample` component is now available to use:
 
+````mdx-code-block
 <BrowserWindow>
 
 ```jsx live
@@ -448,6 +455,7 @@ function MyPlayground(props) {
 ```
 
 </BrowserWindow>
+````
 
 ## Using JSX markup in code blocks {#using-jsx-markup}