diff --git a/web/static/css/tailwind.css b/web/static/css/tailwind.css
index e455d91..d9fcd81 100644
--- a/web/static/css/tailwind.css
+++ b/web/static/css/tailwind.css
@@ -1820,6 +1820,11 @@ code {
     justify-content: flex-end;
   }
 
+  .md\:px-4 {
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+
   .md\:px-40 {
     padding-left: 10rem;
     padding-right: 10rem;
@@ -1854,6 +1859,11 @@ code {
     padding-right: 10rem;
   }
 
+  .lg\:px-8 {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+
   .lg\:py-16 {
     padding-top: 4rem;
     padding-bottom: 4rem;
diff --git a/web/templates/components/settings.tmpl b/web/templates/components/settings.tmpl
index e0136fd..121d49d 100644
--- a/web/templates/components/settings.tmpl
+++ b/web/templates/components/settings.tmpl
@@ -8,7 +8,7 @@
 
 
   <div
-    class="mx-8 mt-8 max-w-screen-xl lg:mt-20 grid grid-cols-1 lg:grid-cols-[min-content_minmax(0,1fr)] gap-8 self-center"
+    class="md:px-4 lg:px-8 mx-auto mt-8 w-full max-w-screen-xl lg:mt-20 grid grid-cols-1 lg:grid-cols-[min-content_minmax(0,1fr)] gap-8"
   >
     <ul class="sidebar">
       {{ range .SettingsSidebar }}