Simple CSS Grid

A simple Flexbox based grid system for CSS.

Install

npm

npm install simple-css-grid

Then import into your sass using @import '~simple-css-grid/scss/simple-grid';

Usage

Documentation coming soon. In the meantime, this works pretty similarly to Bootstrap 4's grid system. E.g.:

<div class="container">
    <div class="row">
        <div class="col-6"> I'm a half width sized column </div>
        <div class="col-3 col-md-6"> I'm a quarter width sized column, but I'll be half width on 768px+ displays. </div>
        <div class="col-3"> I'm a quarter width sized column </div>
    </div>
</div>

Browser support

| IE / Edge | Firefox | Chrome | Safari | iOS Safari | Opera | | --------- | --------- | --------- | --------- | --------- | --------- | | IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions| last 2 versions

Licence

Copyright 2019 Juicy Media Ltd. Code released under the MIT License.