diff --git a/src/components/charts/panel.scss b/src/components/charts/panel.scss
index 49698d3c..94a31ee0 100644
--- a/src/components/charts/panel.scss
+++ b/src/components/charts/panel.scss
@@ -55,27 +55,37 @@
   }
   &>.cn-chart__single-value.cn-chart__single-value--icon-left {
     display: flex;
-    justify-content: space-evenly;
+    justify-content: center;
     align-items: center;
 
+    .single-value-icon__box{
+      height: 70px;
+      flex: 4;
+      display: flex;
+      justify-content: space-around;
+      align-items: center;
+
+    }
+
     .single-value__icon {
-      position: relative;
+      margin-right: 7.5%;
       width: 72px;
       height: 72px;
       background-color: $--chart-single-value-icon-background-color;
       border-radius: 50%;
 
       i {
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        transform: translate(-50%,-50%);
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+        margin-top: 25px;
         font-size: 28px;
         color: $--color-primary;
       }
     }
 
     .single-value__content {
+      flex: 6;
       display: flex;
       flex-direction: column;
 
@@ -86,9 +96,19 @@
         font-weight: bold;
       }
       .content__title {
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        overflow: hidden;
+        word-break: break-all;
+        width: 80px;
         font-size: 16px;
         color: #666666;
       }
+      .content__title:hover{
+        overflow: visible;
+        white-space: inherit;
+        min-width:100%;
+      }
     }
   }
   &>.cn-chart__single-value.cn-chart__single-value--icon-right {