/my-css-grid

Desarrollada con SASS y CSS Grid

Primary LanguageHTML

Grid System using CSS Grid

This grid system was built using only CSS Grids statements and Media Queries for the responsive behavior and First Mobile.

Breakpoints used:

  • Small devices: 576px;
  • Medium devices: 768px;
  • Large devices: 992px;
  • Extra large devices: 1200px;

The grid is set for work with 12 columns, but you can set other number if you need it.

To work with the column system:

  • col-[ Nº Columns ]: Extra Small devices
  • col-sm-[ Nº Columns ]: Small devices
  • col-md-[ Nº Columns ]: Medium devices
  • col-lg-[ Nº Columns ]: Large devices
  • col-xl-[ Nº Columns ]: Extra Large devices

For personal changes you can modify CSS files directly or SASS tool for compiling the code.

 1. npm i -g sass
 2. sass assets/sass/main.scss:assets/css/main.css

This grid system is open source, just include a references to this proyect adding my full name and repository direction in your proyect, please ;).