diff --git a/cypress/e2e/blog.spec.ts b/cypress/e2e/blog.spec.ts
index 1c57086ad..022d48173 100644
--- a/cypress/e2e/blog.spec.ts
+++ b/cypress/e2e/blog.spec.ts
@@ -6,7 +6,7 @@ describe('Blog', () => {
 
   it('can navigate to a post', () => {
     cy.contains('Masonry layout').click({ force: true })
-    cy.location('pathname').should('eq', '/blog/vue-masonry-wall')
+    cy.location('pathname').should('eq', '/blog/vue-masonry-wall/')
   })
 
   it('shows the details of a blog post', () => {
diff --git a/src/pages/blog.astro b/src/pages/blog.astro
index ba8e824e1..61415d355 100644
--- a/src/pages/blog.astro
+++ b/src/pages/blog.astro
@@ -28,7 +28,11 @@ const posts = (await getCollection('blog')).sort(
           const { remarkPluginFrontmatter } = await post.render()
           return (
             <li class="card card-hover overflow-hidden">
-              <a href={post.slug} rel="prefetch" class="block no-underline">
+              <a
+                href={`/blog/${post.slug}/`}
+                rel="prefetch"
+                class="block no-underline"
+              >
                 {post.data.heroImage && (
                   <Image
                     class="w-full h-[100px] object-cover"