diff --git a/assets/sass/pages/_blog-post.sass b/assets/sass/pages/_blog-post.sass
index 1c6eeeefb..c196d2ccf 100644
--- a/assets/sass/pages/_blog-post.sass
+++ b/assets/sass/pages/_blog-post.sass
@@ -5,3 +5,10 @@
         float: left
         margin: 0 1em 1em 0
         width: 50px
+
+.post-pager
+    clear: both
+    margin-top: 2em
+
+.post-pager div
+    flex: 1
diff --git a/source/_partials/post/pager.twig b/source/_partials/post/pager.twig
index 87bfa9308..1597101d1 100644
--- a/source/_partials/post/pager.twig
+++ b/source/_partials/post/pager.twig
@@ -1,6 +1,17 @@
-{% if page.next_post or page.previous_post %}
-    <ul>
-        {% if page.next_post %}<li>Next post: <a href="{{ page.next_post.url }}">{{ page.next_post.title }}</a></li>{% endif %}
-        {% if page.previous_post %}<li>Previous post: <a href="{{ page.previous_post.url }}">{{ page.previous_post.title }}</a></li>{% endif %}
-    </ul>
-{% endif %}
+<div class="post-pager is-flex">
+    {% if page.previous_post %}
+        <div class="is-half">
+           <a href="{{ page.previous_post.url }}">
+                &laquo; {{ page.previous_post.title }}
+            </a>
+        </div>
+    {% endif %}
+
+    {% if page.next_post %}
+        <div class="is-half text-right">
+            <a href="{{ page.next_post.url }}">
+                {{ page.next_post.title }} &raquo;
+            </a>
+        </div>
+    {% endif %}
+</div>