https://github.com/zachacole/Simple-Grid

A simple, lightweight CSS grid
https://github.com/zachacole/Simple-Grid

Last synced: 11 days ago
JSON representation

A simple, lightweight CSS grid

• Host: GitHub
• URL: https://github.com/zachacole/Simple-Grid
• Owner: zachacole
• Created: 2016-04-09T22:54:37.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2024-01-30T01:10:04.000Z (10 months ago)
• Last Synced: 2024-08-02T06:25:27.830Z (3 months ago)
• Language: CSS
• Size: 14.6 KB
• Stars: 876
• Watchers: 30
• Forks: 119
• Open Issues: 17
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Simple Grid

A lightweight, responsive CSS grid  

Developed by Zach Cole

## Simple Grid and Simple Code

Simple Grid is a mobile-first 12-column CSS grid system to make developing responsive websites easy and fast.

All the code you need is simple and familiar. A parent container class contains the grid. Within the container are rows. Row classes denote rows of content, which can be filled with up to 12 columns. Columns must be nested within a row. 

To define your column width, declare how many columns you want your content to take up on desktop and large screens. For example, if your content should take up 6 out of 12 columns (or half the container), your class name will be .col-6.

If you don’t want columns to expand on mobile devices and small screens, simply add -sm to the end of your column class name. For example, if you want to have two blocks of content floating side-by-side on small screens, each would be given the class name .col-6-sm.

Update: Grid styles are now available in SASS/SCSS. Hooray! Thanks to [shankariyerr](https://github.com/shankariyerr/) for contributing as well.

Learn more and see code samples at: http://simplegrid.io

## License

    Open source under the MIT License.