diff --git a/index.html b/index.html
index b9ec8bc..f6c6cbf 100644
--- a/index.html
+++ b/index.html
@@ -173,40 +173,54 @@
 
     <section class="nes-container with-title">
       <h2 class="title">Table</h2>
-      <div class="tables">
+      <div class="nes-table-responsive">
         <table class="nes-table is-bordered is-centered">
           <thead>
             <tr>
               <th>Table.is-bordered</th>
               <th>Table.is-centered</th>
+              <th>Table.is-centered</th>
+              <th>Table.is-centered</th>
             </tr>
           </thead>
           <tbody>
             <tr>
               <td>Thou hast had a good morning</td>
               <td>Thou hast had a good afternoon</td>
+              <td>Thou hast had a good evening</td>
+              <td>Thou hast had a good night</td>
             </tr>
             <tr>
               <td>Thou hast had a good morning</td>
               <td>Thou hast had a good afternoon</td>
+              <td>Thou hast had a good evening</td>
+              <td>Thou hast had a good night</td>
             </tr>
           </tbody>
         </table>
+      </div>
+      <div class="nes-table-responsive">
         <table class="nes-table is-bordered is-dark">
           <thead>
             <tr>
               <th>Table.is-dark</th>
               <th>Table.is-bordered</th>
+              <th>Table.is-bordered</th>
+              <th>Table.is-bordered</th>
             </tr>
           </thead>
           <tbody>
             <tr>
               <td>Thou hast had a good morning</td>
-              <td>Thou hast had a good morning</td>
+              <td>Thou hast had a good afternon</td>
+              <td>Thou hast had a good evening</td>
+              <td>Thou hast had a good night</td>
             </tr>
             <tr>
               <td>Thou hast had a good morning</td>
               <td>Thou hast had a good afternoon</td>
+              <td>Thou hast had a good afternoon</td>
+              <td>Thou hast had a good afternoon</td>
             </tr>
           </tbody>
         </table>
diff --git a/scss/elements/tables.scss b/scss/elements/tables.scss
index fd35802..2e9a94e 100644
--- a/scss/elements/tables.scss
+++ b/scss/elements/tables.scss
@@ -1,3 +1,8 @@
+.nes-table-responsive {
+  max-width: 100%;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
 .nes-table {
   table-layout: fixed;
   background-color: $background-color;
diff --git a/style.css b/style.css
index 7ad5f23..498e264 100644
--- a/style.css
+++ b/style.css
@@ -16,20 +16,6 @@ div.containers > .nes-container {
   max-width: 400px;
 }
 
-div.tables {
-  display: flex;
-  flex-wrap: wrap;
-}
-
-div.tables > .nes-table {
-  min-width: 350px;
-  max-width: calc(50% - 2rem);
-}
-div.tables > .nes-table:first-child {
-  margin-right: 2rem;
-  margin-bottom: 2rem;
-}
-
 .balloon.nes-container .nes-balloon {
   max-width: 600px;
   margin: 2rem 2rem;
@@ -92,10 +78,6 @@ div.tables > .nes-table:first-child {
     padding: 0;
     margin: 2rem 0.2rem;
   }
-  div.tables > .nes-table {
-    max-width: 100%;
-    margin-right: 0;
-  }
   .balloon.nes-container .nes-balloon {
     max-width: 70%;
   }