Fix badge position when it's children is display:block

https://codepen.io/afc163/pen/MBMjqG?editors=0110
ant-design · Aug 16, 2018 · 84119d8 · 84119d8
1 parent b126b23
commit 84119d8
Showing 1 changed file with 7 additions and 5 deletions.
diff --git a/components/badge/style/index.less b/components/badge/style/index.less
@@ -14,8 +14,9 @@
 
   &-count {
     position: absolute;
-    transform: translateX(-50%);
-    top: -@badge-height / 2;
+    transform: translate(50%, -50%);
+    top: 0;
+    right: 0;
     height: @badge-height;
     border-radius: @badge-height / 2;
     min-width: @badge-height;
@@ -27,7 +28,7 @@
     font-size: @badge-font-size;
     font-weight: @badge-font-weight;
     white-space: nowrap;
-    transform-origin: -10% center;
+    transform-origin: 0 center;
     box-shadow: 0 0 0 1px #fff;
     a,
     a:hover {
@@ -41,9 +42,10 @@
 
   &-dot {
     position: absolute;
-    transform: translateX(-50%);
+    transform: translate(50%, -50%);
     transform-origin: 0 center;
-    top: -@badge-dot-size / 2;
+    top: 0;
+    right: 0;
     height: @badge-dot-size;
     width: @badge-dot-size;
     border-radius: 100%;