Fixed page layout to have max-width for content.

Author: patcon

_layouts/page.html

@@ -2,13 +2,15 @@
 layout: default
 ---
 <article class="post">
+  <div class="article-container">
 
-  <header class="post-header">
-    <h1 class="post-title">{{ page.title }}</h1>
-  </header>
+    <header class="post-header">
+      <h1 class="post-title">{{ page.title }}</h1>
+    </header>
 
-  <div class="article-content">
-    {{ content }}
-  </div>
+    <div class="article-content">
+      {{ content }}
+    </div>
 
+  </div>
 </article>

css/custom.css

@@ -23,7 +23,7 @@ a:active, a:hover, a > div:active, a > div:hover {
   outline: 0;
 }
 
-header, main {
+header, main, article {
   display: block;
 }
 
@@ -410,6 +410,13 @@ ol, ul {
   src: url("/assets/Charter.woff")
 }
 
+.article-container {
+  max-width: 780px;
+  margin-left: auto;
+  margin-right: auto;
+  padding: 0 15px;
+}
+
 blockquote {
   font-size: 14px;
 }