Presentable article style with 3 columns.

1 files changed, 43 insertions, 19 deletions

diff --git a/_site/assets/css/main.css b/_site/assets/css/main.css
index 621e0a5..e6c2231 100644
--- a/_site/assets/css/main.css
+++ b/_site/assets/css/main.css
@@ -51,6 +51,18 @@ td {
   width: 50%;
 }
 
+#navlist li
+{
+  display: inline;
+  list-style-type: none;
+  padding-right: 20px;
+}
+
+#navlist > .active > a {
+  font-weight: 600;
+  text-decoration: none;
+}
+
 .author{
   font-size: 1.3em;
   padding-top: 20px;
@@ -95,8 +107,8 @@ td {
 }
 
 #title{
-  padding-top: 50px;
-  padding-bottom: 50px;
+  padding-top: 0px;
+  padding-bottom: 0px;
 }
 
 .center{
@@ -136,11 +148,7 @@ hr.simple {
   font-size: 2.5em;
 }
 
-.twocol::first-letter{
-  font-size: 2.5em;
-}
-
-.threecol{
+.threecol {
   -ms-word-break: keep-all;
   word-break: keep-all;
   hyphens: auto;
@@ -148,27 +156,43 @@ hr.simple {
   -moz-hyphens: auto;
 }
 
-#navlist li
-{
-  display: inline;
-  list-style-type: none;
-  padding-right: 20px;
+@media only screen
+and (min-device-width : 768px)  {
+  .threecol {
+    -moz-column-count: 3;
+    -moz-column-gap: 20px;
+    -webkit-column-count: 3;
+    -webkit-column-gap: 20px;
+    column-count: 3;
+    column-gap: 20px;
+    width: 100%;
+  }
+  .tag{
+    width: 23%;
+    margin-right:0;
+  }
 }
 
+.twocol::first-letter {
+  font-size: 2.5em;
+}
 
-#navlist > .active > a {
-  font-weight: 600;
-  text-decoration: none;
+.twocol{
+  -ms-word-break: keep-all;
+  word-break: keep-all;
+  hyphens: auto;
+  -webkit-hyphens: auto;
+  -moz-hyphens: auto;
 }
 
 @media only screen
 and (min-device-width : 768px)  {
-  .threecol {
-    -moz-column-count: 3;
+  .twocol {
+    -moz-column-count: 2;
     -moz-column-gap: 20px;
-    -webkit-column-count: 3;
+    -webkit-column-count: 2;
     -webkit-column-gap: 20px;
-    column-count: 3;
+    column-count: 2;
     column-gap: 20px;
     width: 100%;
   }