diff --git a/quartz/components/Footer.tsx b/quartz/components/Footer.tsx
index 1f84b5d..bb0e462 100644
--- a/quartz/components/Footer.tsx
+++ b/quartz/components/Footer.tsx
@@ -26,10 +26,12 @@ export default ((opts?: Options) => {
         <div class="rings">
           {Object.entries(rings).map(([text, link]) => (
             <div class="ring">
-              <a href={link}>{text}</a>
               <a class="ringbtn" href={link + "previous?host=nexie.net"}>
                 ◄
               </a>
+              <a class="ringbtn" href={link}>
+                {text}
+              </a>
               <a class="ringbtn" href={link + "random"}>
                 Random
               </a>
diff --git a/quartz/components/styles/footer.scss b/quartz/components/styles/footer.scss
index e36d05d..9ab6f1c 100644
--- a/quartz/components/styles/footer.scss
+++ b/quartz/components/styles/footer.scss
@@ -21,6 +21,8 @@ footer {
 .ring {
   display:flex;
   flex-flow: row wrap;
+  justify-content: center;
+  align-items: center;
 }
 
 .ringbtn {