diff --git a/frontend/src/css/user-settings.css b/frontend/src/css/user-settings.css
index 5767078a82..d5ec2d80b4 100644
--- a/frontend/src/css/user-settings.css
+++ b/frontend/src/css/user-settings.css
@@ -34,7 +34,7 @@ body {
   overflow: auto;
 }
 .setting-item {
-  margin: 1em 0 2em;
+  margin: 1em 0 3em;
 }
 .setting-item-heading {
   font-size: 1rem;
diff --git a/frontend/src/settings.js b/frontend/src/settings.js
index 310c50421b..0f51415233 100644
--- a/frontend/src/settings.js
+++ b/frontend/src/settings.js
@@ -97,7 +97,7 @@ class Settings extends React.Component {
   handleContentScroll = (e) => {
     const scrollTop = e.target.scrollTop;
     const scrolled = this.sideNavItems.filter((item, index) => {
-      return item.show && document.getElementById(item.href.substr(1)).offsetTop - 30 < scrollTop;
+      return item.show && document.getElementById(item.href.substr(1)).offsetTop - 45 < scrollTop;
     });
     if (scrolled.length) {
       this.setState({