diff --git a/README.md b/README.md index b9863c3..a17c232 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,5 @@ # Grider -***Grider*** is a simple enough and fully customizable SCSS-based grid generator. Create your own responsive CSS grid system easily. +***Grider*** is a simple enough and fully customizable SCSS-based grid generator. Create your own responsive CSS grid system easily with offset and equal height features. [![GitHub license](https://img.shields.io/github/license/codeforms/Grider)](https://github.com/codeforms/Grider/blob/master/LICENSE) ![GitHub release (latest by date)](https://img.shields.io/github/v/release/codeforms/Grider) diff --git a/grider.scss b/grider.scss index c93c063..9f251f1 100644 --- a/grider.scss +++ b/grider.scss @@ -12,6 +12,7 @@ $container-name: 'container'; $column-name: 'col'; $offset: 'offset'; + $equal: 'equal'; /*** CONTAINER ***/ $container-width: 97%; @@ -61,7 +62,14 @@ [class^="#{$column-name}"] { float: left; padding: $column-padding; + height: 100%; min-height: $column-min-height; + flex-direction: column; + } + &.#{$equal} { + [class^="#{$column-name}"] { + height: auto; + } } @for $i from 1 through $grid { .#{$column-name}-#{$i} {