diff --git a/docs/cases.md b/docs/cases.md
index e69de29bb2..fbf89cfe8f 100644
--- a/docs/cases.md
+++ b/docs/cases.md
@@ -0,0 +1,5 @@
+# 案例
+
+---
+
+🌰
diff --git a/static/style.css b/static/style.css
index e4892e0b06..c87a996106 100644
--- a/static/style.css
+++ b/static/style.css
@@ -347,7 +347,7 @@ footer ul li > a {
   position: absolute;
   animation: xLeftMatrix .5s ease-out .3s backwards;
   -webkit-animation: xLeftMatrix .5s ease-out .3s backwards;
-  padding-top: 20px;
+  padding-top: 30px;
 }
 
 .aside-container li {
@@ -383,6 +383,13 @@ footer ul li > a {
   height: 100%;
 }
 
+.main-container-center {
+  margin: 0 auto;
+  padding: 30px 0;
+  width: calc(100% - 80px);
+  height: 100%;
+}
+
 .markdown h1,
 .markdown h2,
 .markdown h3,
diff --git a/theme/templates/layout.html b/theme/templates/layout.html
index 8d956023ca..f34e1ed9a2 100644
--- a/theme/templates/layout.html
+++ b/theme/templates/layout.html
@@ -47,9 +47,6 @@
     </nav>
     <div class="nav-phone-icon"></div>
   </header>
-  {%- if post.meta.template === 'component' %}
-  {%- include "aside.html" %}
-  {%- endif %}
   {%- if post.filename === 'index' %}
   <div class="main">
     <div class="main-box" id="main">
@@ -62,7 +59,12 @@
   </div>
   <script src="/static/home.js"></script>
   {%- else %}
-  <section class="main-container">
+    {%- if post.meta.template === 'component' %}
+    {%- include "aside.html" %}
+    <section class="main-container">
+    {%- else %}
+    <section class="main-container-center">
+    {%- endif %}
     <article class="markdown">
       <h1>{{ post.title }}</h1>
       {{ post.html }}