diff --git a/web/src/pages/Settings.tsx b/web/src/pages/Settings.tsx
index 767bdbd..4a49946 100644
--- a/web/src/pages/Settings.tsx
+++ b/web/src/pages/Settings.tsx
@@ -13,18 +13,20 @@ export default function Settings() {
   return (
     <>
       <h2 className="page-title mb-3">Settings</h2>
-      <div className="row">
-        <div className="col-12 col-md-3 col-lg-2 mb-3">
-          <div className="list-group">
-            {SUB_NAV.map((item) => (
-              <NavLink
-                key={item.to}
-                to={item.to}
-                className={({ isActive }) => `list-group-item list-group-item-action ${isActive ? "active" : ""}`}
-              >
-                {item.label}
-              </NavLink>
-            ))}
+      <div className="row align-items-stretch">
+        <div className="col-12 col-md-3 col-lg-2 mb-3 mb-md-0">
+          <div className="card h-100">
+            <div className="list-group list-group-flush">
+              {SUB_NAV.map((item) => (
+                <NavLink
+                  key={item.to}
+                  to={item.to}
+                  className={({ isActive }) => `list-group-item list-group-item-action ${isActive ? "active" : ""}`}
+                >
+                  {item.label}
+                </NavLink>
+              ))}
+            </div>
           </div>
         </div>
         <div className="col-12 col-md-9 col-lg-10">