diff --git a/src/components/datatable/BodyCell.vue b/src/components/datatable/BodyCell.vue
index 0b78ef3875..a2602bb14c 100755
--- a/src/components/datatable/BodyCell.vue
+++ b/src/components/datatable/BodyCell.vue
@@ -83,11 +83,10 @@ export default {
         this.children = this.$children;
     },
     updated() {
-        if (this.d_editing) {
-            let focusable = DomHandler.findSingle(this.$el, 'input');
-            if (focusable) {
-                focusable.focus();
-            }
+        let query = this.editMode === 'row' ? '[autofocus]' : 'input';
+        let focusable = DomHandler.findSingle(this.$el, query);
+        if (focusable && document.activeElement != focusable) {
+            focusable.focus();
         }
     },
     methods: {
diff --git a/src/components/datatable/DataTable.vue b/src/components/datatable/DataTable.vue
index 86fc56d1d7..7cd8b3524e 100755
--- a/src/components/datatable/DataTable.vue
+++ b/src/components/datatable/DataTable.vue
@@ -1963,11 +1963,6 @@ export default {
     display: none;
 }
 
-/* Edit */
-.p-datatable .p-datatable-tbody > tr > td.p-cell-editing .p-component {
-    width: 100%;
-}
-
 .p-datatable .p-row-editor-init,
 .p-datatable .p-row-editor-save,
 .p-datatable .p-row-editor-cancel {
diff --git a/src/views/datatable/DataTableDoc.vue b/src/views/datatable/DataTableDoc.vue
index 67b318239e..e1efda06c6 100755
--- a/src/views/datatable/DataTableDoc.vue
+++ b/src/views/datatable/DataTableDoc.vue
@@ -1116,7 +1116,7 @@ export default {
     <Column field="vin" header="Vin"></Column>
     <Column field="year" header="Year">
         <template #editor="slotProps">
-            <InputText v-model="slotProps.data[slotProps.column.field]" />
+            <InputText v-model="slotProps.data[slotProps.column.field]" autofocus/>
         </template>
     </Column>
     <Column field="brand" header="Brand">
diff --git a/src/views/datatable/DataTableEditDemo.vue b/src/views/datatable/DataTableEditDemo.vue
index e21cfef0d8..53941321d7 100755
--- a/src/views/datatable/DataTableEditDemo.vue
+++ b/src/views/datatable/DataTableEditDemo.vue
@@ -9,7 +9,7 @@
 			</div>
 		</div>
 
-		<div class="content-section implementation">
+		<div class="content-section implementation p-fluid">
             <div class="card">
                 <h5>Basic Cell Editing</h5>
                 <p>Simple editors with v-model.</p>
@@ -62,7 +62,7 @@
                     @row-edit-init="onRowEditInit" @row-edit-cancel="onRowEditCancel">
                     <Column field="code" header="Code">
                         <template #editor="slotProps">
-                            <InputText v-model="slotProps.data[slotProps.column.field]" />
+                            <InputText v-model="slotProps.data[slotProps.column.field]" autofocus />
                         </template>
                     </Column>
                     <Column field="name" header="Name">
@@ -149,7 +149,7 @@
         @row-edit-init="onRowEditInit" @row-edit-cancel="onRowEditCancel"&gt;
         &lt;Column field="code" header="Code"&gt;
             &lt;template #editor="slotProps"&gt;
-                &lt;InputText v-model="slotProps.data[slotProps.column.field]" /&gt;
+                &lt;InputText v-model="slotProps.data[slotProps.column.field]" autofocus /&gt;
             &lt;/template&gt;
         &lt;/Column&gt;
         &lt;Column field="name" header="Name"&gt;