Grid

This is a simplified grid with two and three columns and rows support.


2 Columns

This is a two columns grid

Grid Item 1

Grid Item 2


                  <div class="grid gap-10 grid-cols-2">
                  <div class="card-container center colors-success"><h2>Grid Item 1</h2></div>
                  <div class="card-container center colors-warning"><h2>Grid Item 2</h2></div>
              </div>

3 Columns

This is a three columns grid

Grid Item 1

Grid Item 2

Grid Item 3


                  <div class="grid gap-10 grid-cols-3">
    <div class="card-container center colors-success"><h1>Grid Item 1</h1></div>
    <div class="card-container center  colors-warning"><h1>Grid Item 2</h1></div>
    <div class="card-container center colors-primary"><h1>Grid Item 3</h1></div>
</div>


2 Rows

This is a 2 row grid

Grid Item 1

Grid Item 2


                  <div>
                  <div class="grid gap-10 grid-rows-2">
                  <div class="card-container center colors-success"><h2>Grid Item 1</h2></div>
                  <div class="card-container center colors-warning"><h2>Grid Item 2</h2></div>
              </div>


3 Rows

This is a 3 Row grid

Grid Item 1

Grid Item 2

Grid Item 3


                  <div class="grid gap-10 grid-rows-3">
                  <div class="card-container center colors-success"><h1>Grid Item 1</h1></div>
                  <div class="card-container center card-sq colors-warning"><h1>Grid Item 2</h1></div>
                  <div class="card-container center card-sq colors-primary"><h1>Grid Item 3</h1></div>
              </div>