https://github.com/nimjetushar/grid-css

Grid css for creating responsive web designs
https://github.com/nimjetushar/grid-css

css flexbox grid grid-css grid-layout gulp responsive-grid responsive-layout scss

Last synced: about 2 months ago
JSON representation

Grid css for creating responsive web designs

• Host: GitHub
• URL: https://github.com/nimjetushar/grid-css
• Owner: nimjetushar
• License: mit
• Created: 2018-10-22T14:11:28.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2024-02-01T23:55:08.000Z (over 2 years ago)
• Last Synced: 2025-10-24T09:50:05.789Z (8 months ago)
• Topics: css, flexbox, grid, grid-css, grid-layout, gulp, responsive-grid, responsive-layout, scss
• Language: SCSS
• Homepage: https://nimjetushar.github.io/grid-css/
• Size: 735 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

          
# grid-styles-css

[![Website](https://img.shields.io/website-up-down-green-red/https/shields.io.svg?label=my-website)](https://nimjetushar.github.io/grid-css/)




[![Build Status](https://tushar.semaphoreci.com/badges/grid-css/branches/master.svg?style=shields&key=dd5310cb-b34c-4e8e-a28b-ffe2d5a4f15d)](https://tushar.semaphoreci.com/projects/grid-css)

[![Codacy Badge](https://api.codacy.com/project/badge/Grade/200ab1bddb7641ae8a9c35b4389382ef)](https://www.codacy.com/app/tushar/grid-css?utm_source=github.com&utm_medium=referral&utm_content=nimjetushar/grid-css&utm_campaign=Badge_Grade)




[![GitHub license](https://img.shields.io/github/license/nimjetushar/grid-css.svg)](https://github.com/nimjetushar/grid-css/blob/master/LICENSE) 

[![StackShare](https://img.shields.io/badge/tech-stack-0690fa.svg?style=flat)](https://stackshare.io/nimjetushar/grid-css)

![GitHub pull requests](https://img.shields.io/github/issues-pr/nimjetushar/grid-css.svg)

Grid css for creating responsive web designs

For doc visit [`https://nimjetushar.github.io/grid-css`](https://nimjetushar.github.io/grid-css)

## Getting started

Install package using




``

npm i grid-styled-css --save

``

Import the styles from `~/grid-styled-css/grid/grid.min.css`

## Basic understanding

The basic understanding for rendering grid is the sumation of the used columns which should always be eqaul to 12.

Consider rendering grid using class ```.col-4 .col-6 .col-2 ```. In this sample the summation is ``` 4 + 6 + 2 = 12 ``` so the grid would render properly. So always take care column sumation.

For more reference refer ``` /docs ```.

This grid system is build with reference to bootstrap.

## Licence

[![GitHub license](https://img.shields.io/github/license/nimjetushar/grid-css.svg)](https://github.com/nimjetushar/grid-css/blob/master/LICENSE)