diff --git a/website/versioned_docs/version-2.0.0-beta.19/guides/markdown-features/markdown-features-code-blocks.mdx b/website/versioned_docs/version-2.0.0-beta.19/guides/markdown-features/markdown-features-code-blocks.mdx
index 8edae9e2639e..ff817c1c952a 100644
--- a/website/versioned_docs/version-2.0.0-beta.19/guides/markdown-features/markdown-features-code-blocks.mdx
+++ b/website/versioned_docs/version-2.0.0-beta.19/guides/markdown-features/markdown-features-code-blocks.mdx
@@ -282,9 +282,10 @@ Below, we will introduce how the magic comment system can be extended to define
 
 You can declare custom magic comments through theme config. For example, you can register another magic comment that adds a `code-block-error-line` class name:
 
-`````mdx-code-block
+```mdx-code-block
 <Tabs>
 <TabItem value="docusaurus.config.js">
+```
 
 ```js
 module.exports = {
@@ -309,8 +310,10 @@ module.exports = {
 };
 ```
 
+```mdx-code-block
 </TabItem>
 <TabItem value="src/css/custom.css">
+```
 
 ```css
 .code-block-error-line {
@@ -322,8 +325,10 @@ module.exports = {
 }
 ```
 
+```mdx-code-block
 </TabItem>
 <TabItem value="myDoc.md">
+```
 
 ````md
 In JavaScript, trying to access properties on `null` will error.
@@ -336,10 +341,10 @@ console.log(name.toUpperCase());
 ```
 ````
 
+```mdx-code-block
 </TabItem>
-
 </Tabs>
-`````
+```
 
 ````mdx-code-block
 <BrowserWindow>