From 837d1086025bf8d3956e9f3f7749ae3c00baff3a Mon Sep 17 00:00:00 2001
From: candymask0712 <candymask0712@gmail.com>
Date: Sun, 28 May 2023 16:43:38 +0900
Subject: [PATCH 1/2] fix: remove-display-table for mobile device

---
 packages/typescriptlang-org/src/templates/markdown.scss | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/typescriptlang-org/src/templates/markdown.scss b/packages/typescriptlang-org/src/templates/markdown.scss
index ea7acee7c717..0f63ced8c61c 100644
--- a/packages/typescriptlang-org/src/templates/markdown.scss
+++ b/packages/typescriptlang-org/src/templates/markdown.scss
@@ -118,7 +118,6 @@
 
   table.full-width-table {
     width: 100%;
-    display: table;
   }
 
   .blue-tick {

From 79de98ddb1bac3b5b7aaa40bf390698593ec50bf Mon Sep 17 00:00:00 2001
From: candymask0712 <candymask0712@gmail.com>
Date: Sat, 3 Jun 2023 03:32:41 +0900
Subject: [PATCH 2/2] fix: breaking table problem after delete display:table
 fixed

---
 packages/documentation/copy/en/handbook-v2/Everyday Types.md | 2 ++
 packages/documentation/copy/en/reference/Advanced Types.md   | 2 ++
 packages/typescriptlang-org/src/templates/markdown.scss      | 5 +++++
 3 files changed, 9 insertions(+)

diff --git a/packages/documentation/copy/en/handbook-v2/Everyday Types.md b/packages/documentation/copy/en/handbook-v2/Everyday Types.md
index 18efd3bcbbf9..fda0ffed169f 100644
--- a/packages/documentation/copy/en/handbook-v2/Everyday Types.md	
+++ b/packages/documentation/copy/en/handbook-v2/Everyday Types.md	
@@ -387,6 +387,7 @@ Being concerned only with the structure and capabilities of types is why we call
 Type aliases and interfaces are very similar, and in many cases you can choose between them freely.
 Almost all features of an `interface` are available in `type`, the key distinction is that a type cannot be re-opened to add new properties vs an interface which is always extendable.
 
+<div class='table-container'>
 <table class='full-width-table'>
   <tbody>
     <tr>
@@ -452,6 +453,7 @@ type Window = {
     </tr>
     </tbody>
 </table>
+</div>
 
 You'll learn more about these concepts in later chapters, so don't worry if you don't understand all of these right away.
 
diff --git a/packages/documentation/copy/en/reference/Advanced Types.md b/packages/documentation/copy/en/reference/Advanced Types.md
index b7f17b071cec..fc59dd9da27f 100644
--- a/packages/documentation/copy/en/reference/Advanced Types.md	
+++ b/packages/documentation/copy/en/reference/Advanced Types.md	
@@ -425,6 +425,7 @@ As we mentioned, type aliases can act sort of like interfaces; however, there ar
 
 Almost all features of an `interface` are available in `type`, the key distinction is that a type cannot be re-opened to add new properties vs an interface which is always extendable.
 
+<div class='table-container'>
 <table class='full-width-table'>
   <tbody>
     <tr>
@@ -490,6 +491,7 @@ type Window = {
     </tr>
     </tbody>
 </table>
+</div>
 
 Because an interface more closely maps how JavaScript objects work [by being open to extension](https://wikipedia.org/wiki/Open/closed_principle), we recommend using an interface over a type alias when possible.
 
diff --git a/packages/typescriptlang-org/src/templates/markdown.scss b/packages/typescriptlang-org/src/templates/markdown.scss
index 0f63ced8c61c..63a848efbf98 100644
--- a/packages/typescriptlang-org/src/templates/markdown.scss
+++ b/packages/typescriptlang-org/src/templates/markdown.scss
@@ -116,8 +116,13 @@
     max-width: 100%;
   }
 
+  div.table-container {
+    overflow-x: auto;
+  }
+
   table.full-width-table {
     width: 100%;
+    display: table;
   }
 
   .blue-tick {