diff --git a/src/App.js b/src/App.js
index 0d55ffb4..2cd78de7 100644
--- a/src/App.js
+++ b/src/App.js
@@ -86,6 +86,11 @@ export default {
         'order': this.$store.getters.mergedConfig.sidebarRight ? 99 : 0
       }
     },
+    thirdColumnAlign () {
+      return {
+        'order': this.$store.getters.mergedConfig.sidebarRight ? 0 : 99
+      }
+    },
     thirdColumnLayout () {
       return {
         'max-width': this.$store.getters.mergedConfig.showThirdColumn ? '1400px' : '980px'
diff --git a/src/App.scss b/src/App.scss
index 4ae30ddf..b1a12446 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -576,6 +576,7 @@ nav {
   flex-basis: 25%;
   flex-grow: 1;
   flex-shrink: 1;
+  order: 50;
 }
 
 .sidebar-bounds {
diff --git a/src/App.vue b/src/App.vue
index 83d6a311..b79419e5 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -50,6 +50,7 @@
       </div>
       <div
         v-if="thirdColumnEnabled"
+        :style="thirdColumnAlign"
         class="sidebar-flexer mobile-hidden"
       >
         <div class="sidebar-bounds">