diff --git a/Services/client/src/components/FileItemAction.vue b/Services/client/src/components/FileItemAction.vue
index 9ecd858..746e9b3 100644
--- a/Services/client/src/components/FileItemAction.vue
+++ b/Services/client/src/components/FileItemAction.vue
@@ -6,17 +6,17 @@ defineEmits(['edit', 'delete'])
   <q-btn @click.stop icon="more_vert" color="grey" flat dense>
     <q-menu auto-close>
       <q-list dense>
-        <q-item clickable>
-          <q-item-section @click.prevent.stop="() => $emit('edit')">
-            <div class="row items-center">
+        <q-item clickable @click.prevent.stop="() => $emit('edit')">
+          <q-item-section>
+            <div class="row items-center white  ">
               <q-icon name="edit" color="positive" />
               <span class="q-ml-sm">แก้ไข</span>
             </div>
           </q-item-section>
         </q-item>
-        <q-item clickable>
-          <q-item-section @click.prevent.stop="() => $emit('delete')">
-            <div class="row items-center">
+        <q-item clickable @click.prevent.stop="() => $emit('delete')">
+          <q-item-section>
+            <div class="row items-center white ">
               <q-icon name="delete" color="negative" />
               <span class="q-ml-sm">ลบ</span>
             </div>
@@ -26,3 +26,16 @@ defineEmits(['edit', 'delete'])
     </q-menu>
   </q-btn>
 </template>
+
+
+<style scoped>
+.white  {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: block; 
+
+}
+</style>
+
+