From 57e1425dbcf13b7cd88790acd2267ced7291d09e Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Thu, 7 Dec 2017 13:56:19 +0800 Subject: Add Grid nesting example #353 --- docs/layout.html | 37 ++++++++++++++++++++++++++++++++++++- 1 file changed, 36 insertions(+), 1 deletion(-) (limited to 'docs/layout.html') diff --git a/docs/layout.html b/docs/layout.html index 777fcef..05785db 100644 --- a/docs/layout.html +++ b/docs/layout.html @@ -402,7 +402,7 @@ </div> -

Grid offset

+

Grid offset

The Flexbox grid provides margin auto utilities to set offset. There are col-mx-auto, col-ml-auto and col-mr-auto to set margins between columns without using empty columns.

@@ -460,6 +460,41 @@ <div class="column col-2">col-2</div> </div> </div> + + +

Grid nesting

+
+

To nest grids, add the new columns and column structure within an existing column.

+
+
+
+
col-6
+
+
+
col-6
+
+
+
col-6
+
+
+
+
+
col-6
+
+
+ + +
<div class="container">
+  <div class="columns">
+    <div class="column col-6">col-6
+      <div class="columns">
+        <div class="column col-6">col-6</div>
+        <div class="column col-6">col-6</div>
+      </div>
+    </div>
+    <div class="column col-6">col-6</div>
+  </div>
+</div>
-- cgit v1.3.1-23-gd82d