From 18820ee3c07e02660ecbca4f4a2611c759323f9f Mon Sep 17 00:00:00 2001
From: Siri Reiter <siri@jones.dk>
Date: Fri, 5 Feb 2016 21:07:22 +0100
Subject: Add responsive column count. Set margin and width for max-width 40em.

---
 test.scss | 21 +++++++++++++++++++++
 1 file changed, 21 insertions(+)

(limited to 'test.scss')

diff --git a/test.scss b/test.scss
index d812557..1b69b07 100644
--- a/test.scss
+++ b/test.scss
@@ -26,17 +26,38 @@
 
 //Responsive design
 @media screen and (max-width: 40em) {
+#content {
+	width: 100%;
+	margin: 0;
+}
 .inlinepage {
 	background-color: Blue;
 }
+.columns {
+	-webkit-column-count: 1; /* Chrome, Safari, Opera */
+	-moz-column-count: 1; /* Firefox */
+	column-count: 1;
+}
 }
+
 @media screen and (min-width: 41em) and (max-width: 70em) {
 .inlinepage {
 	background-color: Black;
 }
+.columns {
+	-webkit-column-count: 2; /* Chrome, Safari, Opera */
+	-moz-column-count: 2; /* Firefox */
+	column-count: 2;
+}
 }
+
 @media only screen and (min-width: 71em) {
 .inlinepage {
 	background-color: Red;
 }
+.columns {
+	-webkit-column-count: 3; /* Chrome, Safari, Opera */
+	-moz-column-count: 3; /* Firefox */
+	column-count: 3;
+}
 }
-- 
cgit v1.2.3