diff --git a/demo/spreadsheet-shape-projection.html b/demo/spreadsheet-shape-projection.html
index b9e4e56..8a4d5a1 100644
--- a/demo/spreadsheet-shape-projection.html
+++ b/demo/spreadsheet-shape-projection.html
@@ -28,6 +28,10 @@
       <folk-shape x="100" y="100" width="50" height="50"></folk-shape>
       <folk-shape x="100" y="200" width="50" height="50"></folk-shape>
       <folk-shape x="100" y="300" width="50" height="50" rotation="45"></folk-shape>
+      <folk-shape x="200" y="200" width="50" height="50" rotation="45"></folk-shape>
+      <folk-shape x="400" y="100" width="50" height="50"></folk-shape>
+      <folk-shape x="300" y="200" width="50" height="50"></folk-shape>
+      <folk-shape x="500" y="300" width="50" height="50" rotation="45"></folk-shape>
     </folk-space-projector>
 
     <script type="module">
diff --git a/src/folk-space-projector.ts b/src/folk-space-projector.ts
index c71e6d8..e636bd7 100644
--- a/src/folk-space-projector.ts
+++ b/src/folk-space-projector.ts
@@ -13,13 +13,15 @@ export class FolkSpaceProjector extends FolkBaseSet {
   static override styles = [
     FolkBaseSet.styles,
     css`
-      folk-shape {
+      folk-spreadsheet {
+        position: absolute;
+        bottom: 5px;
+        right: 5px;
         pointer-events: auto;
       }
     `,
   ];
 
-  #shape = document.createElement('folk-shape');
   #spreadsheet = document.createElement('folk-spreadsheet');
 
   override firstUpdated(changedProperties: PropertyValues<this>): void {
@@ -27,9 +29,7 @@ export class FolkSpaceProjector extends FolkBaseSet {
 
     this.#spreadsheet.style.setProperty('--cell-width', '50px');
 
-    this.#shape.appendChild(this.#spreadsheet);
-
-    this.renderRoot.append(this.#shape);
+    this.renderRoot.append(this.#spreadsheet);
   }
 
   connectedCallback(): void {