diff --git a/opentech/static_src/src/app/src/components/Listing/index.js b/opentech/static_src/src/app/src/components/Listing/index.js
index d924649585c234389daa3c3b7d6d5c622c655586..d1c8d0675c2ad92f38711fa7b867d5493a5520cf 100644
--- a/opentech/static_src/src/app/src/components/Listing/index.js
+++ b/opentech/static_src/src/app/src/components/Listing/index.js
@@ -20,6 +20,10 @@ export default class Listing extends React.Component {
         column: PropTypes.string,
     };
 
+    componentDidUpdate() {
+        this.setLastItemHeight();
+    }
+
     renderListItems() {
         const {
             isError,
@@ -46,6 +50,8 @@ export default class Listing extends React.Component {
             );
         }
 
+        this.setLastItemHeight();
+
         return (
             <ul className={`listing__list listing__list--${column}`} ref={listRef}>
                 {items.map(v => renderItem(v))}
@@ -65,6 +71,14 @@ export default class Listing extends React.Component {
         );
     }
 
+    // set css custom prop to allow scrolling from dropdown to last item in the list
+    setLastItemHeight() {
+        const { listRef } = this.props;
+        if (listRef.current) {
+            document.documentElement.style.setProperty('--last-listing-item-height', listRef.current.lastElementChild.offsetHeight + 'px');
+        }
+    }
+
     render() {
         return (
             <div className="listing">
diff --git a/opentech/static_src/src/app/src/components/Listing/style.scss b/opentech/static_src/src/app/src/components/Listing/style.scss
index af322e21688e739ad49dc88449e806516cc68832..5764b72db54f640cb25deb6e0843e6b18efd2361 100644
--- a/opentech/static_src/src/app/src/components/Listing/style.scss
+++ b/opentech/static_src/src/app/src/components/Listing/style.scss
@@ -25,6 +25,19 @@
             height: calc(100vh -  #{$listing-header-height});
         }
 
+        // ensures the last item will be at the top of the column after navigating to it via the dropdown
+        &--applications {
+            padding-bottom: calc(100vh - var(--last-listing-item-height) - #{$listing-header-height});
+
+            @include media-query(tablet-landscape) {
+                padding-bottom: calc(100vh - var(--header-admin-height) - var(--last-listing-item-height) - #{$listing-header-height});
+            }
+
+            @include media-query(laptop-short) {
+                padding-bottom: calc(100vh - var(--last-listing-item-height) - #{$listing-header-height});
+            }
+        }
+
         &.is-loading {
             padding: 20px;
             border-right: 2px solid $color--light-mid-grey;
diff --git a/opentech/static_src/src/sass/apply/abstracts/_variables.scss b/opentech/static_src/src/sass/apply/abstracts/_variables.scss
index c4e87dfd68b25855e2d32040473b05eebd7d5b49..d2ccac0959a6de51db5de760b9b87f058c823116 100644
--- a/opentech/static_src/src/sass/apply/abstracts/_variables.scss
+++ b/opentech/static_src/src/sass/apply/abstracts/_variables.scss
@@ -1,6 +1,8 @@
 // sass-lint:disable no-color-keywords; no-color-hex
+// Set via JS
 :root {
     --header-admin-height: 0;
+    --last-listing-item-height: 0;
 }
 
 // Default