diff --git a/exampleSite/layouts/partials/recent-articles-demo.html b/exampleSite/layouts/partials/recent-articles-demo.html
index 6586d196..25ff4965 100644
--- a/exampleSite/layouts/partials/recent-articles-demo.html
+++ b/exampleSite/layouts/partials/recent-articles-demo.html
@@ -16,12 +16,12 @@
     </span>
 </div>
 
-<div id="CardViewProse" class="hidden h-full">
-    <section class="w-full">
-        <div class="flex flex-wrap">
+<div id="CardViewScreenWidth" class="">
+    <section class="relative w-screen max-w-[1600px]" style="left: calc(max(-50vw,-800px) + 50%);">
+        <div class="flex flex-wrap pl-8 pr-8">
             {{ range first $recentArticles (.Paginate (where .Site.RegularPages "Type" "in"
             .Site.Params.mainSections)).Pages }}
-            <div class="flex flex-wrap w-full p-4 sm:w-1/2 md:w-1/3">
+            <div class="flex flex-wrap w-full p-4 sm:w-1/2 md:w-1/3 xl:w-1/4 2xl:w-1/5">
                 {{ partial "article-link-card.html" . }}
             </div>
             {{ end }}
@@ -29,12 +29,12 @@
     </section>
 </div>
 
-<div id="CardViewScreenWidth" class="">
-    <section class="relative w-screen max-w-[1600px]" style="left: calc(max(-50vw,-800px) + 50%);">
-        <div class="flex flex-wrap pl-8 pr-8">
+<div id="CardViewProse" class="hidden h-full">
+    <section class="w-full">
+        <div class="flex flex-wrap">
             {{ range first $recentArticles (.Paginate (where .Site.RegularPages "Type" "in"
             .Site.Params.mainSections)).Pages }}
-            <div class="flex flex-wrap w-full p-4 sm:w-1/2 md:w-1/3 xl:w-1/4 2xl:w-1/5">
+            <div class="flex flex-wrap w-full p-4 sm:w-1/2 md:w-1/3">
                 {{ partial "article-link-card.html" . }}
             </div>
             {{ end }}