diff --git a/src/routes/blog/+page.svelte b/src/routes/blog/+page.svelte
index 1fda149..ab8635f 100644
--- a/src/routes/blog/+page.svelte
+++ b/src/routes/blog/+page.svelte
@@ -46,11 +46,11 @@
 		>
 			{monthYear}
 		</h1>
-		<div class="flex flex-col flex-wrap items-stretch gap-4">
+		<div class="flex flex-col flex-wrap items-center gap-4">
 			{#each postsInMonthYear as post, i}
 				<a
 					href="/blog/{post.slug}"
-					class="flex flex-col justify-baseline overflow-hidden rounded-lg bg-slate-100 text-slate-950 drop-shadow-xl transition-all hover:drop-shadow-2xl sm:flex-row sm:justify-stretch"
+					class="flex w-full max-w-5xl flex-col justify-baseline overflow-hidden rounded-lg bg-slate-100 text-slate-950 drop-shadow-xl transition-all hover:drop-shadow-2xl sm:flex-row sm:justify-stretch"
 				>
 					<div class="relative h-32 w-full basis-auto sm:h-auto sm:basis-1/3">
 						{#if post.thumbnail}
diff --git a/src/routes/blog/[slug]/+page.svelte b/src/routes/blog/[slug]/+page.svelte
index f9a3fc8..b143f3e 100644
--- a/src/routes/blog/[slug]/+page.svelte
+++ b/src/routes/blog/[slug]/+page.svelte
@@ -27,6 +27,7 @@
 		</div>
 	</div>
 </section>
+
 <section
 	class="flex shrink-0 flex-col items-center justify-center p-4 font-bold {isPublic
 		? 'bg-amber-50 text-slate-950'
@@ -79,6 +80,8 @@
 		hover:prose-a:transition-all
 		prose-code:break-words
 		prose-pre:drop-shadow-md
+		mx-auto
+		w-5xl
 		bg-white
 		p-4 lg:p-8"
 >