diff --git a/views/pages/index.ejs b/views/pages/index.ejs
index 3ca9ac564b40a95dac6acb65fb198130931c73eb..1f35c4989d44e6984661e44ff3353e6b0b90b094 100644
--- a/views/pages/index.ejs
+++ b/views/pages/index.ejs
@@ -4,17 +4,27 @@
 <div class="main-content">
   <div class="d-flex justify-content-between align-items-center mb-5">
     <h1 class="h2 fw-bold text-primary">All Posts</h1>
-    <form action="/index" method="GET" class="mb-4">
-      <label for="category" class="form-label">Filter by Category:</label>
-      <select name="category" id="category" class="form-select w-auto d-inline-block" onchange="this.form.submit()">
-        <option value="">All Categories</option>
-        <% categories.forEach(category => { %>
-          <option value="<%= category.id %>" <%= selectedCategory == category.id ? 'selected' : '' %>>
-            <%= category.name %>
-          </option>
-        <% }) %>
-      </select>
-    </form>
+    <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap">
+      <h1 class="h2 fw-bold text-primary">All Posts</h1>
+      
+      <div class="d-flex align-items-center gap-3">
+        <label for="category" class="form-label mb-0 fw-semibold text-muted">Filter by Category:</label>
+        <form action="/index" method="GET" class="d-flex align-items-center gap-2">
+          <select name="category" id="category" class="form-select form-select-sm w-auto" onchange="this.form.submit()">
+            <option value="">All Categories</option>
+            <% categories.forEach(category => { %>
+              <option value="<%= category.id %>" <%= selectedCategory == category.id ? 'selected' : '' %>>
+                <%= category.name %>
+              </option>
+            <% }) %>
+          </select>
+        </form>
+      </div>
+    
+      <div class="badge bg-primary rounded-pill px-3 py-2">
+        <%= posts.length %> posts
+      </div>
+    </div>
     
     <div class="badge bg-primary rounded-pill"><%= posts.length %> posts</div>
   </div>