diff --git a/src/views/datatable/DataTableDemo.vue b/src/views/datatable/DataTableDemo.vue
index d08448152..53f292412 100755
--- a/src/views/datatable/DataTableDemo.vue
+++ b/src/views/datatable/DataTableDemo.vue
@@ -102,7 +102,7 @@
                         </template>
                         <template #filter="{filterModel}">
                             <Slider v-model="filterModel.value" range class="m-3"></Slider>
-                            <div class="flex align-items-center justify-content-center px-2">
+                            <div class="flex align-items-center justify-content-between px-2">
                                 <span>{{filterModel.value ? filterModel.value[0] : 0}}</span>
                                 <span>{{filterModel.value ? filterModel.value[1] : 100}}</span>
                             </div>
diff --git a/src/views/datatable/DataTableDoc.vue b/src/views/datatable/DataTableDoc.vue
index 58c40aa60..84ebec4c4 100755
--- a/src/views/datatable/DataTableDoc.vue
+++ b/src/views/datatable/DataTableDoc.vue
@@ -2723,7 +2723,7 @@ export default {
                 </template>
                 <template #filter="{filterModel}">
                     <Slider v-model="filterModel.value" range class="m-3"></Slider>
-                    <div class="flex align-items-center justify-content-center px-2">
+                    <div class="flex align-items-center justify-content-between px-2">
                         <span>{{filterModel.value ? filterModel.value[0] : 0}}</span>
                         <span>{{filterModel.value ? filterModel.value[1] : 100}}</span>
                     </div>
@@ -2947,7 +2947,7 @@ export default {
                 </template>
                 <template #filter="{filterModel}">
                     <Slider v-model="filterModel.value" range class="m-3"></Slider>
-                    <div class="flex align-items-center justify-content-center px-2">
+                    <div class="flex align-items-center justify-content-between px-2">
                         <span>{{filterModel.value ? filterModel.value[0] : 0}}</span>
                         <span>{{filterModel.value ? filterModel.value[1] : 100}}</span>
                     </div>
@@ -3210,7 +3210,7 @@ img {
                     </template>
                     <template #filter="{filterModel}">
                         <p-slider v-model="filterModel.value" range class="m-3"></p-slider>
-                        <div class="flex align-items-center justify-content-center px-2">
+                        <div class="flex align-items-center justify-content-between px-2">
                             <span>{{filterModel.value ? filterModel.value[0] : 0}}</span>
                             <span>{{filterModel.value ? filterModel.value[1] : 100}}</span>
                         </div>