diff --git a/app/assets/stylesheets/milestones.scss b/app/assets/stylesheets/milestones.scss
index ade816c56..1b12eef0c 100644
--- a/app/assets/stylesheets/milestones.scss
+++ b/app/assets/stylesheets/milestones.scss
@@ -25,6 +25,21 @@
     }
   }
 
+  [data-text] {
+    display: block;
+    font-weight: bold;
+    position: relative;
+
+    &::after {
+      content: attr(data-text);
+      left: 0;
+      position: absolute;
+      text-align: right;
+      top: -0.1rem;
+      width: 100%;
+    }
+  }
+
   progress {
     $background-color: #fef0e2;
     $progress-color: #fea230;
diff --git a/app/helpers/milestones_helper.rb b/app/helpers/milestones_helper.rb
index 62df63624..e127dee5c 100644
--- a/app/helpers/milestones_helper.rb
+++ b/app/helpers/milestones_helper.rb
@@ -1,9 +1,14 @@
 module MilestonesHelper
   def progress_tag_for(progress_bar)
-    content_tag :progress,
-                number_to_percentage(progress_bar.percentage, precision: 0),
-                class: progress_bar.primary? ? "primary" : "",
-                max: ProgressBar::RANGE.max,
-                value: progress_bar.percentage
+    text = number_to_percentage(progress_bar.percentage, precision: 0)
+
+    content_tag :span do
+      content_tag(:span, "", "data-text": text, style: "width: #{progress_bar.percentage}%;") +
+      content_tag(:progress,
+                  text,
+                  class: progress_bar.primary? ? "primary" : "",
+                  max: ProgressBar::RANGE.max,
+                  value: progress_bar.percentage)
+    end
   end
 end