diff --git a/app/javascript/mastodon/features/compose/components/search.jsx b/app/javascript/mastodon/features/compose/components/search.jsx
index 7fa7ad248b..a38e71864a 100644
--- a/app/javascript/mastodon/features/compose/components/search.jsx
+++ b/app/javascript/mastodon/features/compose/components/search.jsx
@@ -346,10 +346,12 @@ class Search extends PureComponent {
 
               <div className='search__popout__menu'>
                 {recent.size > 0 ? this._getOptions().map(({ label, key, action, forget }, i) => (
-                  <button key={key} onMouseDown={action} className={classNames('search__popout__menu__item search__popout__menu__item--flex', { selected: selectedOption === i })}>
-                    <span>{label}</span>
+                  <div key={key} className='search__popout__menu__item search__popout__menu__item--flex'>
+                    <button onMouseDown={action} className={classNames({ selected: selectedOption === i })}>
+                      <span>{label}</span>
+                    </button>
                     <button className='icon-button' onMouseDown={forget}><Icon id='times' icon={CloseIcon} /></button>
-                  </button>
+                  </div>
                 )) : (
                   <div className='search__popout__menu__message'>
                     <FormattedMessage id='search.no_recent_searches' defaultMessage='No recent searches' />
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 14de6e6818..9b9a11cdc5 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -5589,26 +5589,33 @@ a.status-card {
 
       &__item {
         display: block;
-        box-sizing: border-box;
         width: 100%;
-        border: 0;
-        font: inherit;
-        background: transparent;
-        color: $darker-text-color;
-        padding: 10px;
-        cursor: pointer;
         border-radius: 4px;
-        text-align: start;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: nowrap;
 
         &--flex {
           display: flex;
           justify-content: space-between;
         }
 
+        &:is(button),
+        button {
+          flex: 1;
+          box-sizing: border-box;
+          border: 0;
+          font: inherit;
+          background: transparent;
+          color: $darker-text-color;
+          padding: 10px;
+          cursor: pointer;
+          text-align: start;
+          text-overflow: ellipsis;
+          overflow: hidden;
+          white-space: nowrap;
+        }
+
         .icon-button {
+          flex: 0;
+          padding: 10px 20px 10px 10px;
           transition: none;
         }