All Projects → vladocar → Infinity Css Grid

vladocar / Infinity Css Grid

Licence: mit
Fluid Flex Solution for making infinite grid columns.

Projects that are alternatives of or similar to Infinity Css Grid

Katana
Katana is CSS Layout System made with Flexbox
Stars: ✭ 57 (-49.11%)
Mutual labels:  flex, flexbox, css-framework, css-grid, flexbox-grid
Waffle Grid
An easy to use flexbox grid system.
Stars: ✭ 602 (+437.5%)
Mutual labels:  flex, flexbox-grid, flexbox, css-grid
The Flex Grid
The Flex Grid is a responsive CSS flexbox grid. Because we can!
Stars: ✭ 45 (-59.82%)
Mutual labels:  css-framework, flexbox-grid, flexbox, css-grid
Frow
Flexbox Toolkit & Grid
Stars: ✭ 152 (+35.71%)
Mutual labels:  css-framework, flexbox-grid, flexbox, css-grid
Flexible Grid
Flexible grid layouts to get you familiar with building within the flexible grid system.(HTML, CSS, SASS, SCSS)
Stars: ✭ 154 (+37.5%)
Mutual labels:  css-framework, flex, flexbox-grid, flexbox
Must Watch Css
A useful list of must-watch talks about CSS
Stars: ✭ 3,966 (+3441.07%)
Mutual labels:  css-framework, flexbox, css-grid
Cirrus
☁️ The CSS framework for the modern web.
Stars: ✭ 716 (+539.29%)
Mutual labels:  css-framework, flexbox, css-grid
Vue Flexboxgrid
Vue components made with Flexboxgrid
Stars: ✭ 37 (-66.96%)
Mutual labels:  flexbox-grid, flexbox, css-grid
tetris-grid
◼️Lightweight and simple CSS grid
Stars: ✭ 16 (-85.71%)
Mutual labels:  flexbox, css-grid, flexbox-grid
Flexy
Flexy is minimal CSS framework made with Flex
Stars: ✭ 114 (+1.79%)
Mutual labels:  flex, flexbox-grid, flexbox
40-lines-of-Sass
Full featured flexbox grid in 40 lines of Sass
Stars: ✭ 20 (-82.14%)
Mutual labels:  flexbox, css-grid, flexbox-grid
Pintsize
Customisable 💪 Flexbox grid system
Stars: ✭ 330 (+194.64%)
Mutual labels:  flexbox-grid, flexbox
Csslayout
This project is developed by Nguyen Huu Phuoc. I love building products and sharing knowledge.
Stars: ✭ 4,832 (+4214.29%)
Mutual labels:  flexbox, css-grid
Smart Css Grid
SMART CSS GRID - CSS Framework
Stars: ✭ 291 (+159.82%)
Mutual labels:  css-framework, css-grid
React Three Flex
💪📦 Flexbox for react-three-fiber
Stars: ✭ 764 (+582.14%)
Mutual labels:  flex, flexbox
Milligram
A minimalist CSS framework.
Stars: ✭ 9,568 (+8442.86%)
Mutual labels:  css-framework, flexbox
React Flexview
A powerful React component to abstract over flexbox and create any layout on any browser
Stars: ✭ 276 (+146.43%)
Mutual labels:  flex, flexbox
Sprite Flex Layout
grid-layout is a layout engine which implements flex, can use in canvas/node-canvas
Stars: ✭ 15 (-86.61%)
Mutual labels:  flex, flexbox
Atgrid.css
CSS Grid System with attribute selectors
Stars: ✭ 37 (-66.96%)
Mutual labels:  flexbox-grid, flexbox
Lemon
🍋 Minimal and responsive CSS framework for fast building websites.
Stars: ✭ 51 (-54.46%)
Mutual labels:  css-framework, flexbox

Gzip Size

Infinity CSS Grid

Ultra minimal fluid Flex Grid.


Infinity CSS Grid is around 0,1 Kb CSS for making any number of columns.

Just add any number of .column in the .row:

// For 3 columns:

<div class="row">
  <div class="column">1</div>
  <div class="column">1</div>
  <div class="column">1</div>
</div>

The CSS code is based on this:

.row{display: flex; flex-flow: row wrap}

.column{flex:1}

You can make tests here: https://vladocar.github.io/infinity-css-grid/demo1.html

Installation

Just simply download the project or:

$ npm i infinity-css-grid
<link rel="stylesheet" href="https://unpkg.com/[email protected]/grid.css">

Demo:

https://vladocar.github.io/infinity-css-grid/

License

This project is licensed under the MIT License

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].