supported-devices: Equal column height and vertical spacing for tablets

Signed-off-by: Paul Kocialkowski <contact@paulk.fr>

1 files changed, 32 insertions, 0 deletions

diff --git a/css/equal-height-columns.css b/css/equal-height-columns.css
new file mode 100644
index 0000000..5d78527
--- /dev/null
+++ b/css/equal-height-columns.css
@@ -0,0 +1,32 @@
+/*
+ * Row with equal height columns
+ * --------------------------------------------------
+ */
+.row-eq-height {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display:         flex;
+}
+
+.row-eq-height > div {
+  padding-bottom: 20px;
+}
+
+.row-eq-height > div > a {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  height: 100%;
+}
+
+.row-eq-height .vertical-spacer {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  height: 100%;
+}
+
+.row-eq-height .vertical-spacer img {
+  width: 100%;
+}