diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entries/block-grid-entries.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entries/block-grid-entries.element.ts
index fe7917928c..ce4b663517 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entries/block-grid-entries.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entries/block-grid-entries.element.ts
@@ -207,8 +207,9 @@ export class UmbBlockGridEntriesElement extends UmbLitElement {
 					(x) => x.contentUdi,
 					(layoutEntry, index) =>
 						html`<umb-block-grid-entry
+							?at-root=${this._areaKey === null}
 							class="umb-block-grid__layout-item"
-							.index=${index}
+							index=${index}
 							.contentUdi=${layoutEntry.contentUdi}
 							.layout=${layoutEntry}>
 						</umb-block-grid-entry>`,
diff --git a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts
index eaf3493964..7f3a31f2a6 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/block/block-grid/components/block-grid-entry/block-grid-entry.element.ts
@@ -22,7 +22,7 @@ import '../block-scale-handler/index.js';
 @customElement('umb-block-grid-entry')
 export class UmbBlockGridEntryElement extends UmbLitElement implements UmbPropertyEditorUiElement {
 	//
-	@property({ type: Number })
+	@property({ type: Number, reflect: true })
 	public get index(): number | undefined {
 		return this.#context.getIndex();
 	}
@@ -309,9 +309,28 @@ export class UmbBlockGridEntryElement extends UmbLitElement implements UmbProper
 				--umb-block-grid__block--inline-create-button-display--condition: var(--umb-block-grid--dragging-mode) none;
 				display: var(--umb-block-grid__block--inline-create-button-display--condition);
 			}
+			uui-button-inline-create:not([vertical]) {
+				left: 0;
+				width: var(--umb-block-grid-editor--inline-create-width, 100%);
+			}
+			:host(:not([index='0'])) uui-button-inline-create:not([vertical]) {
+				top: calc(var(--umb-block-grid--row-gap, 0px) * -0.5);
+			}
+
+			:host([at-root]) uui-button-inline-create[vertical] {
+				/* If at root, and full-width then become 40px wider: */
+				--calc: clamp(0, calc(var(--umb-block-grid--item-column-span) - (var(--umb-block-grid--grid-columns)-1)), 1);
+				left: calc(-20px * var(--calc));
+				width: calc(var(--umb-block-grid-editor--inline-create-width, 100%) + 40px * var(--calc));
+			}
 			uui-button-inline-create[vertical] {
 				right: calc(1px - (var(--umb-block-grid--column-gap, 0px) * 0.5));
 			}
+			:host([at-root]) uui-button-inline-create[vertical] {
+				/* If at root, and full-width then move a little out to the right: */
+				--calc: clamp(0, calc(var(--umb-block-grid--item-column-span) - (var(--umb-block-grid--grid-columns)-1)), 1);
+				right: calc(-2px * var(--calc));
+			}
 
 			:host([drag-placeholder]) {
 				opacity: 0.2;