https://github.com/awps/zgrid

A modern CSS flexbox grid system.
https://github.com/awps/zgrid

css flex flexbox fluid grid responsive sass scss system zgrid

Last synced: 2 months ago
JSON representation

A modern CSS flexbox grid system.

• Host: GitHub
• URL: https://github.com/awps/zgrid
• Owner: awps
• Created: 2017-06-11T13:36:49.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2018-05-02T17:34:49.000Z (over 6 years ago)
• Last Synced: 2024-01-04T18:05:45.905Z (about 1 year ago)
• Topics: css, flex, flexbox, fluid, grid, responsive, sass, scss, system, zgrid
• Language: CSS
• Homepage: http://zgrid.zerowp.com/
• Size: 92.8 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
### zGrid

---

A modern grid system using CSS3 Flexible Box(flex-box).

#### Demo and docs: http://zgrid.zerowp.com/

#### License: MIT

[![NPM](https://nodei.co/npm/zgrid.png?compact=true)](https://nodei.co/npm/zgrid/)

### Changelog:

**2.0.2**

* New: Added the modern version of grid, without support for Internet Explorer and other old browsers.

**2.0.1**

 * New: Use the prefix `-v` to add vertical gutter as well. Example`.zg-{?}-v-min-gutter`.

**2.0.0**

 * New: `.zg-{?}-min-gutter` for less space between columns.

 * New: `.zg-{?}-max-gutter` for more space between columns.

 * New: `.zg-{?}-space-between` Distribute items evenly. Items have a half-size space on either end.

 * New: `.zg-{?}-space-around` Distribute items evenly. The first item is flush with the start, the last is flush with the end.

 * Modified: `.zg-{?}-left` now it's `.zg-{?}-start` because it can be used to arrange the columns when they are in vertical direction.

 * Modified: `.zg-{?}-right` now it's `.zg-{?}-end` because it can be used to arrange the columns when they are in vertical direction.

 * Modified: `.zg-{?}-ltr` now it's `.zg-{?}-row`.

 * Modified: `.zg-{?}-rtl` now it's `.zg-{?}-row-reverse`. 

 * New: `.zg-{?}-column` display the columns in vertical order.

 * New: `.zg-{?}-column-reverse` display the columns in vertical order but in reverse order.

 * Source files are moved in `src` folder. Distributable files are moved in `dist` folder.

 

 _Other_

 * Demo style ported from LESS to SCSS.

 * Files are processed by Gulp. Prepros is removed from project.

 

**1.0.0**

 * Initial release