diff --git a/dashmachine/static/css/settings_system/settings.css b/dashmachine/static/css/settings_system/settings.css
index 5d71fc3..c2451c3 100644
--- a/dashmachine/static/css/settings_system/settings.css
+++ b/dashmachine/static/css/settings_system/settings.css
@@ -6,7 +6,18 @@
     }
 }
 
-.settings-page-card {
+@media (max-width: 990px)
+{
+    body {
+        max-height: 200vh !important;
+    }
+}
+
+.settings-page-card-right {
+    max-height: calc(100vh - 142px) !important;
+    min-height: calc(100vh - 142px) !important;
+}
+.settings-page-card-left {
     max-height: calc(100vh - 30px);
     min-height: calc(100vh - 30px);
 }
diff --git a/dashmachine/static/js/settings_system/settings.js b/dashmachine/static/js/settings_system/settings.js
index 99950f8..d1f7e41 100644
--- a/dashmachine/static/js/settings_system/settings.js
+++ b/dashmachine/static/js/settings_system/settings.js
@@ -2,6 +2,7 @@ var d = document.getElementById("settings-sidenav");
 d.className += " active theme-primary";
 
 $( document ).ready(function() {
+    $("#config-readme table").addClass('responsive-table');
     initTCdrop('#images-tcdrop');
     $("#user-modal").modal({
         onCloseEnd: function () {
diff --git a/dashmachine/templates/settings_system/files.html b/dashmachine/templates/settings_system/files.html
index ad88556..cc059dd 100644
--- a/dashmachine/templates/settings_system/files.html
+++ b/dashmachine/templates/settings_system/files.html
@@ -38,17 +38,25 @@
                 {% if backgrounds %}
                     {% for background in backgrounds %}
                         <li class="collection-item pt-2 pb-2 avatar">
-                            <a href="static/images/backgrounds/{{ background }}" target="_blank">
-                                <img src="static/images/backgrounds/{{ background }}" alt="" class="circle">
-                            </a>
-                            <span class="selectable-all copy-target file-title">static/images/backgrounds/{{ background }}</span>
-                            <span class="secondary-content">
-                            <i class="material-icons-outlined icon-btn delete-file-btn"
-                               data-url="{{ url_for('settings_system.delete_file') }}"
-                               data-folder="backgrounds"
-                               data-file="{{ background }}">close</i>
-                        </span>
-                            <span class="secondary-content mr-4"><i class="material-icons-outlined icon-btn copy-btn">filter_none</i></span>
+                            <div class="row">
+                                <div class="col s12 mt-2">
+                                    <a href="static/images/backgrounds/{{ background }}" target="_blank">
+                                        <img src="static/images/backgrounds/{{ background }}" alt="" class="circle">
+                                    </a>
+                                    <span class="selectable-all copy-target file-title"  style="word-wrap: break-word;">static/images/backgrounds/{{ background }}</span>
+                                </div>
+
+                                <div class="col s12 mt-2">
+                                    <span class="theme-secondary-text right">
+                                        <i class="material-icons-outlined icon-btn copy-btn">filter_none</i>
+                                        <i class="material-icons-outlined icon-btn delete-file-btn"
+                                           data-url="{{ url_for('settings_system.delete_file') }}"
+                                           data-folder="backgrounds"
+                                           data-file="{{ background }}">close
+                                        </i>
+                                    </span>
+                                </div>
+                            </div>
                         </li>
                     {% endfor %}
                 {% else %}
@@ -65,17 +73,25 @@
                 {% if icons %}
                     {% for icon in icons %}
                         <li class="collection-item pt-2 pb-2 avatar">
-                            <a href="static/images/icons/{{ icon }}" target="_blank">
-                                <img src="static/images/icons/{{ icon }}" alt="" class="circle">
-                            </a>
-                            <span class="selectable-all copy-target file-title">static/images/icons/{{ icon }}</span>
-                            <span class="secondary-content">
-                            <i class="material-icons-outlined icon-btn delete-file-btn"
-                               data-url="{{ url_for('settings_system.delete_file') }}"
-                               data-folder="icons"
-                               data-file="{{ icon }}">close</i>
-                        </span>
-                            <span class="secondary-content mr-4"><i class="material-icons-outlined icon-btn copy-btn">filter_none</i></span>
+                            <div class="row">
+                                <div class="col s12 mt-2">
+                                    <a href="static/images/icons/{{ icon }}" target="_blank">
+                                        <img src="static/images/icons/{{ icon }}" alt="" class="circle">
+                                    </a>
+                                    <span class="selectable-all copy-target file-title" style="word-wrap: break-word;">static/images/icons/{{ icon }}</span>
+                                </div>
+
+                                <div class="col s12 mt-2">
+                                    <span class="theme-secondary-text right">
+                                        <i class="material-icons-outlined icon-btn copy-btn">filter_none</i>
+                                        <i class="material-icons-outlined icon-btn delete-file-btn"
+                                           data-url="{{ url_for('settings_system.delete_file') }}"
+                                           data-folder="icons"
+                                           data-file="{{ icon }}">close
+                                        </i>
+                                    </span>
+                                </div>
+                            </div>
                         </li>
                     {% endfor %}
                 {% else %}
diff --git a/dashmachine/templates/settings_system/settings.html b/dashmachine/templates/settings_system/settings.html
index 2990c23..e1b0139 100644
--- a/dashmachine/templates/settings_system/settings.html
+++ b/dashmachine/templates/settings_system/settings.html
@@ -26,7 +26,7 @@
         <div class="container">
             <div class="row">
                 <div class="col s12 m12 l6">
-                    <div class="card scrollbar settings-page-card">
+                    <div class="card scrollbar settings-page-card-left">
                         <div class="card-content">
                                 <div class="row">
                                     <div class="col s12">
@@ -56,7 +56,7 @@
                 </div>
 
                 <div class="col s12 m12 l6">
-                    <div class="card scrollbar settings-page-card">
+                    <div class="card">
                         <div class="card-content">
 
                             <div class="row">
@@ -80,11 +80,11 @@
                                     </ul>
                                 </div>
 
-                                <div id="images" class="col s12">
+                                <div id="images" class="col s12 scrollbar settings-page-card-right">
                                     {{ FilesTab() }}
                                 </div>
 
-                                <div id="apps" class="col s12">
+                                <div id="apps" class="col s12 scrollbar settings-page-card-right">
                                     <h5>App Templates</h5>
                                     <div class="row card-filter-container">
                                         <div class="col s12 input-field">
@@ -99,18 +99,18 @@
                                         </div>
                                     </div>
                                     <div class="row">
-                                        <div class="col s12">
+                                        <div class="col s12 scrollbar settings-page-card-right">
                                             <div id="template-div" class="selectable-all code"></div>
                                         </div>
                                     </div>
 
                                 </div>
 
-                                <div id="config-readme" class="col s12">
+                                <div id="config-readme" class="col s12 scrollbar settings-page-card-right">
                                     {{ config_readme|safe }}
                                 </div>
 
-                                <div id="user" class="col s12">
+                                <div id="user" class="col s12 scrollbar settings-page-card-right">
                                     {{ UserTab() }}
                                 </div>