Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/peterramsing/lost

LostGrid is a powerful grid system built in PostCSS that works with any preprocessor and even vanilla CSS.
https://github.com/peterramsing/lost

css grid javascript postcss

Last synced: about 1 month ago
JSON representation

LostGrid is a powerful grid system built in PostCSS that works with any preprocessor and even vanilla CSS.

Host: GitHub
URL: https://github.com/peterramsing/lost
Owner: peterramsing
License: mit
Created: 2015-03-08T09:41:28.000Z (over 9 years ago)
Default Branch: main
Last Pushed: 2024-03-03T07:29:51.000Z (8 months ago)
Last Synced: 2024-05-22T22:32:27.821Z (6 months ago)
Topics: css, grid, javascript, postcss
Language: JavaScript
Homepage: http://lostgrid.org
Size: 1.67 MB
Stars: 4,504
Watchers: 111
Forks: 161
Open Issues: 21
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE

Awesome Lists containing this project

README

        


  





  

  

  

  



  



LostGrid is a powerful grid system built in [PostCSS](https://github.com/postcss/postcss) that works with any preprocessor and even vanilla CSS.

If you have any questions, comments, or concerns please feel free to [open an issue](https://github.com/peterramsing/lost/issues/new). You're also welcome to tweet [@LostGrid](https://twitter.com/lostgrid) if an issue seems too formal.

---

## Getting Started

- [Installation Guide](https://github.com/peterramsing/lost/wiki/Installation)

- [Getting Started Video](https://youtu.be/6FN7QU1ZxqA)

LostGrid makes use of [`calc()`](https://developer.mozilla.org/en-US/docs/Web/CSS/calc) to create stunning grids based on fractions you define without having to pass a lot of options.

Read the docs on [LostGrid.org](http://lostgrid.org/docs.html)!

## Browser Support

- LostGrid relies on [`calc()`](https://developer.mozilla.org/en-US/docs/Web/CSS/calc) to create the grid. Thus, LostGrid is limited to browsers that support `calc()`. The great thing is that `calc()` is widely supported in all current browsers and the LostGrid usage of `calc()` is supported as far back as IE9+.

- **If using LostGrid in flexbox mode** browser support is limited to IE 10+.

- [Calc browser support](http://caniuse.com/#feat=calc)

- [Flexbox browser support](http://caniuse.com/#feat=flexbox)

### Official Support

- LostGrid is tested in the following browsers for compatibility

  - IE10+ (IE9 has the same `calc()` support as IE10 except for background position which LostGrid doesn't affect)

  - Evergreen Browsers (as they update automatically, tests are performed on the latest version of the following browsers)

    - Chrome

      - Chrome Canary + Chromium as well

    - Opera

    - Firefox

      - FirefoxDeveloperEdition as well

    - Edge

  - Safari 9+

- Automated browser testing with Selenium is coming soon. 👍

### LostGrid Team

- [Peter Ramsing](https://github.com/peterramsing) - Maintainer

- [Steve Holland](https://github.com/codebysubtract) - Maintainer

- [Jay Pick](https://github.com/japick) - LostGrid Website

- [You!](https://github.com/peterramsing/lost/graphs/contributors)

 

### Thanks

- [Cory Simmons](https://github.com/corysimmons) for creating this grid!

- [Alex Bass](http://abass.co) for being available to bounce ideas off of.

- [Maria Keller](https://dribbble.com/mariakeller) for the amazing logo. Be sure to hire her for all your design and motion graphic needs.

- Everyone who files an [Issue](https://github.com/peterramsing/lost/issues) when something isn't working as expected.

- Everyone who has [contributed](https://github.com/peterramsing/lost/graphs/contributors).