diff --git a/app/assets/javascripts/issuable/popover/components/milestone_popover.vue b/app/assets/javascripts/issuable/popover/components/milestone_popover.vue
index a3cf1475ade8d7db22b04a90b9ffa9b00acae77d..1977629d9999fbcc874837787dd53a334339db00 100644
--- a/app/assets/javascripts/issuable/popover/components/milestone_popover.vue
+++ b/app/assets/javascripts/issuable/popover/components/milestone_popover.vue
@@ -164,7 +164,7 @@ export default {
     :target="target"
     boundary="viewport"
     :placement="placement"
-    :css-classes="['gl-min-w-34']"
+    :css-classes="['gl-min-w-max']"
     show
   >
     <div class="gl-flex gl-items-center gl-gap-2">
@@ -174,7 +174,10 @@ export default {
       <span class="gl-flex gl-text-subtle" data-testid="milestone-label">
         <gl-icon name="milestone" class="gl-mr-1" variant="subtle" /> {{ __('Milestone') }}
       </span>
-      <span v-if="showTimeframe" class="gl-text-subtle" data-testid="milestone-timeframe"
+      <span
+        v-if="showTimeframe"
+        class="gl-whitespace-nowrap gl-text-subtle"
+        data-testid="milestone-timeframe"
         >&middot; {{ milestoneTimeframe }}</span
       >
     </div>