diff --git a/README.md b/README.md
index 3869a60..4f4c998 100644
--- a/README.md
+++ b/README.md
@@ -59,4 +59,4 @@ docker run -p 3000:3000 \
 
 ## Authorization
 
-This application does not perform authorisation of users. I recommend using a proxy such as [oauth2-proxy](https://github.com/oauth2-proxy/oauth2-proxy) to protect your application.
+This application does not perform authorisation of users. I recommend using a proxy such as [oauth2-proxy](https://github.com/oauth2-proxy/oauth2-proxy) to protect your files from unauthorised access.
diff --git a/src/routes/views.ts b/src/routes/views.ts
index daee545..a343235 100644
--- a/src/routes/views.ts
+++ b/src/routes/views.ts
@@ -27,12 +27,27 @@ viewRoutes.get("/", async (c) => {
     continuationToken,
   });
 
-  // If it's an HTMX request, return just the browser content
+  // If it's an HTMX request, return both navigation and content
   if (c.req.header("HX-Request")) {
-    const content = browser(result, prefix, query);
-    const doc = new DOMParser().parseFromString(content, "text/html");
-    const browserContent = doc?.querySelector("#browser-content")?.innerHTML || "";
-    return c.html(browserContent);
+    return c.html(`
+      <div class="breadcrumbs">
+        <a href="/" 
+           hx-get="/"
+           hx-target="#browser-content"
+           hx-push-url="true">Home</a>
+        ${prefix.split("/").filter(Boolean).map((part, i, parts) => {
+          const path = parts.slice(0, i + 1).join("/");
+          return `
+            <a href="/?prefix=${path}"
+               hx-get="/?prefix=${path}"
+               hx-target="#browser-content"
+               hx-push-url="true">${part}</a>
+          `;
+        }).join(" / ")}
+      </div>
+      ${objectList(result)}
+      ${pagination(result)}
+    `);
   }
   
   // Otherwise return the full layout
diff --git a/src/templates/browser.ts b/src/templates/browser.ts
index 93c06a8..30682fe 100644
--- a/src/templates/browser.ts
+++ b/src/templates/browser.ts
@@ -14,37 +14,25 @@ export function browser(
       
       ${search(query)}
       
-      <div class="browser-navigation">
-        ${renderBreadcrumbs(prefix)}
-      </div>
-      
       <div id="browser-content">
+        <div class="breadcrumbs">
+          <a href="/" 
+             hx-get="/"
+             hx-target="#browser-content"
+             hx-push-url="true">Home</a>
+          ${prefix.split("/").filter(Boolean).map((part, i, parts) => {
+            const path = parts.slice(0, i + 1).join("/");
+            return `
+              <a href="/?prefix=${path}"
+                 hx-get="/?prefix=${path}"
+                 hx-target="#browser-content"
+                 hx-push-url="true">${part}</a>
+            `;
+          }).join(" / ")}
+        </div>
         ${objectList(result)}
         ${pagination(result)}
       </div>
     </div>
   `;
-}
-
-export function renderBreadcrumbs(prefix: string) {
-  const parts = prefix.split("/").filter(Boolean);
-  const links = parts.map((part, i) => {
-    const path = parts.slice(0, i + 1).join("/");
-    return `
-      <a href="/?prefix=${path}"
-         hx-get="/?prefix=${path}"
-         hx-target="#browser-content"
-         hx-push-url="true">${part}</a>
-    `;
-  });
-  
-  return `
-    <div class="breadcrumbs">
-      <a href="/" 
-         hx-get="/"
-         hx-target="#browser-content"
-         hx-push-url="true">Home</a>
-      ${links.length ? " / " + links.join(" / ") : ""}
-    </div>
-  `;
 } 
diff --git a/src/templates/components/object_list.ts b/src/templates/components/object_list.ts
index 94280d1..cef95ec 100644
--- a/src/templates/components/object_list.ts
+++ b/src/templates/components/object_list.ts
@@ -7,7 +7,7 @@ export function objectList(result: ListObjectsResult) {
         <div class="folder">
           <a href="/?prefix=${prefix}"
              hx-get="/?prefix=${prefix}"
-             hx-target="#browser-content"
+             hx-target="#browser-navigation, #browser-content"
              hx-push-url="true">
             📁 ${prefix}
           </a>