diff --git a/apps/web/src/components/ChildCollection.tsx b/apps/web/src/components/ChildCollection.tsx
index af3d764..bd4a5eb 100644
--- a/apps/web/src/components/ChildCollection.tsx
+++ b/apps/web/src/components/ChildCollection.tsx
@@ -118,6 +118,16 @@ export function ChildCollection({
     }
   }
 
+  const colCount = config.fields.length + (canEdit ? 1 : 0);
+
+  function editorRow() {
+    return (
+      <tr>
+        <td colSpan={colCount}>{editor()}</td>
+      </tr>
+    );
+  }
+
   function editor() {
     return (
       <div className="child-editor">
@@ -196,39 +206,44 @@ export function ChildCollection({
               </tr>
             </thead>
             <tbody>
-              {rows.map((row) => (
-                <tr key={String(row.id)}>
-                  {config.fields.map((f) => (
-                    <td key={f.key}>{cellText(f, row[f.key])}</td>
-                  ))}
-                  {canEdit && (
-                    <td>
-                      <div className="row-actions">
-                        <button
-                          type="button"
-                          className="btn btn-ghost"
-                          onClick={() => startEdit(row)}
-                        >
-                          Editar
-                        </button>
-                        <button
-                          type="button"
-                          className="btn btn-ghost"
-                          onClick={() => remove(String(row.id))}
-                        >
-                          Eliminar
-                        </button>
-                      </div>
-                    </td>
-                  )}
-                </tr>
-              ))}
+              {adding && editorRow()}
+              {rows.map((row) =>
+                editingId === String(row.id) ? (
+                  <tr key={String(row.id)}>
+                    <td colSpan={colCount}>{editor()}</td>
+                  </tr>
+                ) : (
+                  <tr key={String(row.id)}>
+                    {config.fields.map((f) => (
+                      <td key={f.key}>{cellText(f, row[f.key])}</td>
+                    ))}
+                    {canEdit && (
+                      <td>
+                        <div className="row-actions">
+                          <button
+                            type="button"
+                            className="btn btn-ghost"
+                            onClick={() => startEdit(row)}
+                          >
+                            Editar
+                          </button>
+                          <button
+                            type="button"
+                            className="btn btn-ghost"
+                            onClick={() => remove(String(row.id))}
+                          >
+                            Eliminar
+                          </button>
+                        </div>
+                      </td>
+                    )}
+                  </tr>
+                ),
+              )}
             </tbody>
           </table>
         </div>
       )}
-
-      {(adding || editingId !== null) && editor()}
     </div>
   );
 }