diff --git a/app/assets/javascripts/discourse/templates/components/badge-button.hbs b/app/assets/javascripts/discourse/templates/components/badge-button.hbs
index 7c0469791ec..4886147389c 100644
--- a/app/assets/javascripts/discourse/templates/components/badge-button.hbs
+++ b/app/assets/javascripts/discourse/templates/components/badge-button.hbs
@@ -1,3 +1,3 @@
 {{icon-or-image badge.icon}}
-{{badge.displayName}}
+<span class="badge-display-name">{{badge.displayName}}</span>
 {{yield}}
diff --git a/app/assets/stylesheets/common/base/user-badges.scss b/app/assets/stylesheets/common/base/user-badges.scss
index 24691c940e6..74b87c82651 100644
--- a/app/assets/stylesheets/common/base/user-badges.scss
+++ b/app/assets/stylesheets/common/base/user-badges.scss
@@ -51,7 +51,9 @@
     }
 
     img {
-      display: inline-block;
+      display: block;
+      margin: auto;
+      margin-bottom: 4px;
       width: 55px;
       height: 55px;
     }