diff --git a/public/css/building.css b/public/css/building.css
index 125ef65..5519409 100644
--- a/public/css/building.css
+++ b/public/css/building.css
@@ -381,14 +381,29 @@ body {
   display: grid;
 
   grid-template-columns: repeat(8, 70px);
-  grid-template-rows: repeat(4, 70px);
+  grid-auto-rows: 70px;
 
   gap: 8px;
 
-  max-height: 320px;
-  overflow-y: auto;
+  width: max-content;
+
+  margin: 0 auto;
 
   padding: 10px;
+
+  max-height: 320px;
+
+  overflow-y: auto;
+}
+
+#inventory-wrapper {
+  width: 620px;
+
+  margin: 0 auto;
+
+  max-height: 320px;
+
+  overflow-y: auto;
 }
 
 .inventory-slot {
diff --git a/public/js/buildings/wohnhaus.js b/public/js/buildings/wohnhaus.js
index 5988d5c..93a126e 100644
--- a/public/js/buildings/wohnhaus.js
+++ b/public/js/buildings/wohnhaus.js
@@ -53,7 +53,9 @@ export async function loadWohnhaus() {
 
 <h3>Inventar</h3>
 
+<div id="inventory-wrapper">
 <div id="inventory-grid"></div>
+</div>
 
 `;
 
@@ -107,7 +109,8 @@ async function loadInventory() {
 
   /* feste 32 slots erzeugen */
 
-  for (let i = 0; i < 32; i++) {
+  const totalSlots = Math.max(32, items.length);
+  for (let i = 0; i < totalSlots; i++) {
     const item = items[i];
 
     if (item) {