diff --git a/src/public/app/widgets/note_tree.js b/src/public/app/widgets/note_tree.js
index 3b3333b95..aba4b7dab 100644
--- a/src/public/app/widgets/note_tree.js
+++ b/src/public/app/widgets/note_tree.js
@@ -550,7 +550,9 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
                 if (isHoistedNote) {
                     const $unhoistButton = $('<span class="tree-item-button unhoist-button bx bx-door-open" title="Unhoist"></span>');
 
-                    $span.append($unhoistButton);
+                    // unhoist button is prepended since compared to other buttons this is not just convenience
+                    // on the mobile interface - it's the only way to unhoist
+                    $span.prepend($unhoistButton);
                 }
 
                 if (note.hasLabel('workspace') && !isHoistedNote) {
diff --git a/src/public/stylesheets/tree.css b/src/public/stylesheets/tree.css
index ddf9fc81b..dd70c50d8 100644
--- a/src/public/stylesheets/tree.css
+++ b/src/public/stylesheets/tree.css
@@ -211,6 +211,10 @@ span.fancytree-node.archived {
     border-radius: 5px;
 }
 
+.unhoist-button.bx.tree-item-button {
+    margin-left: 0; /* unhoist button is on the left and doesn't need more margin */
+}
+
 .tree-item-button:hover {
     border: 1px dotted var(--main-text-color);
 }