diff --git a/core/core-frontend/src/custom-component/common/CommonStyleSet.vue b/core/core-frontend/src/custom-component/common/CommonStyleSet.vue
index d11c8e59db..89460beb24 100644
--- a/core/core-frontend/src/custom-component/common/CommonStyleSet.vue
+++ b/core/core-frontend/src/custom-component/common/CommonStyleSet.vue
@@ -153,7 +153,7 @@
           </div>
         </el-tooltip>
         <template v-if="styleForm.textAlign">
-          <div class="m-divider"></div>
+          <div class="m-divider" :class="'custom-divider-' + themes"></div>
           <el-tooltip effect="dark" placement="bottom">
             <template #content>
               {{ t('chart.text_pos_left') }}
@@ -466,6 +466,14 @@ watch(
   height: 18px;
   background: rgba(31, 35, 41, 0.15);
 }
+
+.custom-divider-light {
+  background-color: rgba(31, 35, 41, 0.15);
+}
+
+.custom-divider-dark {
+  background-color: #757575;
+}
 .form-item {
   &.no-margin-bottom {
     margin-bottom: 0 !important;
diff --git a/core/core-frontend/src/custom-component/de-time-clock/TimeDefault.vue b/core/core-frontend/src/custom-component/de-time-clock/TimeDefault.vue
index 2643e1835e..6d78612df6 100644
--- a/core/core-frontend/src/custom-component/de-time-clock/TimeDefault.vue
+++ b/core/core-frontend/src/custom-component/de-time-clock/TimeDefault.vue
@@ -1,5 +1,8 @@
 <template>
-  <div style="width: 100%; height: 100%; display: flex; align-items: center">
+  <div
+    style="width: 100%; height: 100%; display: flex; align-items: center"
+    :style="{ 'justify-content': element.style.textAlign }"
+  >
     <p>{{ state.nowDate }}</p>
   </div>
 </template>