diff --git a/src/editors/sharedComponents/SelectionModal/SearchSort.jsx b/src/editors/sharedComponents/SelectionModal/SearchSort.jsx
index 273d552019..85ced8301a 100644
--- a/src/editors/sharedComponents/SelectionModal/SearchSort.jsx
+++ b/src/editors/sharedComponents/SelectionModal/SearchSort.jsx
@@ -71,7 +71,7 @@ const SearchSort = ({
           >
             <span className="search-sort-menu-by">
               <FormattedMessage {...messages.sortBy} />
-              <span style={{ whiteSpace: 'pre-wrap' }}></span>
+              <span style={{ whiteSpace: 'pre-wrap' }}>{' '}</span>
             </span>
             <FormattedMessage {...sortMessages[key]} />
           </MenuItem>
diff --git a/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx b/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx
index 5c8c2580b6..5af337b785 100644
--- a/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx
+++ b/src/editors/sharedComponents/SelectionModal/SearchSort.test.jsx
@@ -71,6 +71,11 @@ describe('SearchSort component', () => {
           .toBeInTheDocument();
       });
   });
+  test('separates "By" from the sort option', () => {
+    getComponent();
+    expect(screen.getByRole('button', { name: /By oldest/i }))
+      .toHaveTextContent('By oldest');
+  });
   test('adds a filter option for each filter key', () => {
     const { getByTestId } = getComponent();
     fireEvent.click(getByTestId('dropdown-filter'));
diff --git a/src/editors/sharedComponents/SelectionModal/index.scss b/src/editors/sharedComponents/SelectionModal/index.scss
index 19d975b22f..931a94d2fb 100644
--- a/src/editors/sharedComponents/SelectionModal/index.scss
+++ b/src/editors/sharedComponents/SelectionModal/index.scss
@@ -38,3 +38,9 @@
     max-width: 100%;
     max-height: 100%;
 }
+
+/* The sort menu is wider than its toggle; anchor it right so it stays inside the modal. */
+.search-sort-menu .pgn__menu-select-popup > div {
+    left: auto !important;
+    right: 0 !important;
+}