make the project columns more responsive than they currently are...

bionode · May 6, 2017 · 44efa3f · 44efa3f
1 parent 735366f
commit 44efa3f
Showing 1 changed file with 23 additions and 1 deletion.
diff --git a/style.css b/style.css
@@ -569,6 +569,8 @@ h3{
     -webkit-box-direction: normal;
     -webkit-flex-direction: row;
     flex-direction: row;
+    justify-content: center;
+    align-items: center;
 }
 
 .project-column {
@@ -696,7 +698,6 @@ h3{
     text-overflow: ellipsis;
     white-space: nowrap;
     vertical-align: top;
-    display: inline-block;
     padding: 3px 4px;
     font-size: 12px;
     font-weight: 600;
@@ -745,6 +746,27 @@ h3{
         padding-top: 30px;
     }
 }
+
+@media screen and (max-width: 1515px) {
+    .project-column {
+      max-width:325px;
+      min-width:325px;
+    }
+}
+
+@media screen and (max-width: 1415px) {
+    .project-column {
+      max-width:315px;
+      min-width:315px;
+    }
+}
+
+@media screen and (max-width: 1370px) {
+    .project-columns-container {
+        justify-content: flex-start;
+    }
+}
+
 @media screen and (min-width: 1115px) and (max-width: 1190px) {
     .header-nav-list li{
         margin-right: 13px;