diff --git a/lib/components/SDropdownSectionFilter.vue b/lib/components/SDropdownSectionFilter.vue
index 143c5755..4dd14e15 100644
--- a/lib/components/SDropdownSectionFilter.vue
+++ b/lib/components/SDropdownSectionFilter.vue
@@ -125,7 +125,6 @@ function handleClick(option: DropdownSectionFilterOption, value: string | number
 
 .button {
   display: flex;
-  align-items: center;
   border-radius: 6px;
   padding: 0 8px;
   width: 100%;
@@ -145,6 +144,7 @@ function handleClick(option: DropdownSectionFilterOption, value: string | number
 
 .checkbox {
   display: block;
+  padding-top: 9px;
 }
 
 .checkbox-box {
@@ -177,6 +177,11 @@ function handleClick(option: DropdownSectionFilterOption, value: string | number
   }
 }
 
+.option-item {
+  padding-left: 8px;
+  width: 100%;
+}
+
 .empty {
   padding: 16px;
   font-size: 12px;
diff --git a/lib/components/SDropdownSectionFilterItemAvatar.vue b/lib/components/SDropdownSectionFilterItemAvatar.vue
index da2d3af0..153e506f 100644
--- a/lib/components/SDropdownSectionFilterItemAvatar.vue
+++ b/lib/components/SDropdownSectionFilterItemAvatar.vue
@@ -9,23 +9,32 @@ defineProps<{
 
 <template>
   <span class="SDropdownSectionFilterItemAvatar">
-    <SAvatar size="nano" :avatar="image" :name="label" />
+    <div class="avatar">
+      <SAvatar size="nano" :avatar="image" :name="label" />
+    </div>
     <span class="name">{{ label }}</span>
   </span>
 </template>
 
 <style scoped lang="postcss">
 .SDropdownSectionFilterItemAvatar {
-  display: inline-flex;
+  display: flex;
   align-items: center;
-  padding-left: 8px;
+  padding-right: 16px;
   min-height: 32px;
 }
 
+.avatar {
+  flex-shrink: 0;
+}
+
 .name {
   display: inline-block;
   padding-left: 8px;
   font-size: 12px;
   font-weight: 500;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 </style>
diff --git a/lib/components/SDropdownSectionFilterItemText.vue b/lib/components/SDropdownSectionFilterItemText.vue
index 5d51c54c..382826ba 100644
--- a/lib/components/SDropdownSectionFilterItemText.vue
+++ b/lib/components/SDropdownSectionFilterItemText.vue
@@ -6,14 +6,18 @@ defineProps<{
 
 <template>
   <span class="SDropdownSectionFilterItemText">
-    {{ label }}
+    <span class="text">{{ label }}</span>
   </span>
 </template>
 
 <style scoped lang="postcss">
 .SDropdownSectionFilterItemText {
-  padding-left: 8px;
-  line-height: 32px;
+  display: inline-block;
+  padding: 6px 0;
+}
+
+.text {
+  line-height: 20px;
   font-size: 12px;
   font-weight: 500;
 }