diff --git a/src/components/Nav/ProfilePopup.tsx b/src/components/Nav/ProfilePopup.tsx
index 90909bea..f29509cc 100644
--- a/src/components/Nav/ProfilePopup.tsx
+++ b/src/components/Nav/ProfilePopup.tsx
@@ -18,7 +18,7 @@ export const ProfilePopup = (props: ProfilePopupProps) => {
   const { t } = useLocalize()
 
   return (
-    <Popup {...props} horizontalAnchor="right">
+    <Popup {...props} horizontalAnchor="right" popupCssClass={styles.profilePopup}>
       <ul class="nodash">
         <li>
           <a class={styles.action} href={getPagePath(router, 'author', { slug: author().slug })}>
diff --git a/src/components/_shared/Popup/Popup.module.scss b/src/components/_shared/Popup/Popup.module.scss
index 7677a3aa..3ae6d95c 100644
--- a/src/components/_shared/Popup/Popup.module.scss
+++ b/src/components/_shared/Popup/Popup.module.scss
@@ -127,6 +127,12 @@
   }
 }
 
+.profilePopup {
+  @include media-breakpoint-up(sm) {
+    min-width: 22rem;
+  }
+}
+
 // TODO: animation
 // .popup {
 //  opacity: 1;