diff --git a/scss/_badge.scss b/scss/_badge.scss
index 2e489a05b1..bdbe4b9cc8 100644
--- a/scss/_badge.scss
+++ b/scss/_badge.scss
@@ -14,7 +14,7 @@
   vertical-align: baseline;
   @include border-radius($badge-border-radius);
 
-  &[href] {
+  @at-root a#{&} {
     @include hover-focus {
       text-decoration: none;
     }
diff --git a/scss/mixins/_badge.scss b/scss/mixins/_badge.scss
index 535bcb4cc3..cf99b3537a 100644
--- a/scss/mixins/_badge.scss
+++ b/scss/mixins/_badge.scss
@@ -2,7 +2,7 @@
   color: color-yiq($bg);
   background-color: $bg;
 
-  &[href] {
+  @at-root a#{&} {
     @include hover-focus {
       color: color-yiq($bg);
       background-color: darken($bg, 10%);