diff --git a/frontend/app.js b/frontend/app.js
index d6c2536..1b19dec 100644
--- a/frontend/app.js
+++ b/frontend/app.js
@@ -601,8 +601,8 @@ function updateLocationInfoBanner(searchLocation) {
         <span>Showing schools within ${searchLocation.radius} miles of <strong>${searchLocation.postcode.toUpperCase()}</strong></span>
     `;
 
-  // Insert banner before the schools grid
-  elements.schoolsGrid.parentNode.insertBefore(banner, elements.schoolsGrid);
+  // Insert banner before the results container (above map view)
+  elements.resultsContainer.parentNode.insertBefore(banner, elements.resultsContainer);
 }
 
 async function searchByLocation() {
diff --git a/frontend/styles.css b/frontend/styles.css
index 5756d9e..d5d6f32 100644
--- a/frontend/styles.css
+++ b/frontend/styles.css
@@ -453,7 +453,7 @@ body {
     display: grid;
     grid-template-columns: 1fr 400px;
     gap: 1.5rem;
-    min-height: 600px;
+    height: 600px;
 }
 
 .results-container.map-view .results-map {
@@ -461,15 +461,17 @@ body {
     border-radius: var(--radius-lg);
     overflow: hidden;
     border: 1px solid var(--border-color);
-    min-height: 600px;
+    height: 100%;
+    position: relative;
+    z-index: 1;
 }
 
 .results-container.map-view .schools-grid {
     display: flex;
     flex-direction: column;
-    gap: 1rem;
+    gap: 0.75rem;
     overflow-y: auto;
-    max-height: 600px;
+    height: 100%;
     padding-right: 0.5rem;
 }
 
@@ -852,16 +854,17 @@ body {
     .results-container.map-view {
         grid-template-columns: 1fr;
         grid-template-rows: 350px auto;
-        min-height: auto;
+        height: auto;
     }
 
     .results-container.map-view .results-map {
-        min-height: 350px;
+        height: 350px;
     }
 
     .results-container.map-view .schools-grid {
-        max-height: none;
-        overflow-y: visible;
+        height: auto;
+        max-height: 400px;
+        overflow-y: auto;
     }
 }