{"id":21270422,"url":"https://github.com/dan503/gutter-grid","last_synced_at":"2025-07-11T05:31:57.699Z","repository":{"id":15938201,"uuid":"75425487","full_name":"Dan503/gutter-grid","owner":"Dan503","description":"A Sass flexbox based grid system that is able to replicate CSS grid-gap in IE11","archived":false,"fork":false,"pushed_at":"2022-02-09T22:59:33.000Z","size":4773,"stargazers_count":18,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2024-11-20T11:55:47.022Z","etag":null,"topics":["backup","flexbox","grid","grid-system","gutter-grid","legacy-browsers","mq-scss","responsive","responsive-grid"],"latest_commit_sha":null,"homepage":"http://gutter-grid.net","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Dan503.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-12-02T19:41:38.000Z","updated_at":"2023-08-02T18:45:04.000Z","dependencies_parsed_at":"2022-08-07T08:01:26.093Z","dependency_job_id":null,"html_url":"https://github.com/Dan503/gutter-grid","commit_stats":null,"previous_names":[],"tags_count":20,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dan503%2Fgutter-grid","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dan503%2Fgutter-grid/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dan503%2Fgutter-grid/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Dan503%2Fgutter-grid/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Dan503","download_url":"https://codeload.github.com/Dan503/gutter-grid/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":225693742,"owners_count":17509228,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["backup","flexbox","grid","grid-system","gutter-grid","legacy-browsers","mq-scss","responsive","responsive-grid"],"created_at":"2024-11-21T08:17:25.155Z","updated_at":"2024-11-21T08:17:25.680Z","avatar_url":"https://github.com/Dan503.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"[![Gutter Grid logo](https://dan503.github.io/gutter-grid//assets/images/social-media.jpg)](https://dan503.github.io/gutter-grid/)\n\n```\nnpm install gutter-grid --save\n```\n\nDocumenation website: https://dan503.github.io/gutter-grid/\n\n## Why use [Gutter Grid](https://dan503.github.io/gutter-grid/)?\n\n### The problem\n\nCSS Grid is now implemented in all modern browsers. All of our layout dreams have come true! ... Well almost all of them.\n\nUnfortunately IE11 still holds a fairly significant market share and it doesn't support the modern implementation of CSS Grid. It can be difficult to get people on board with the idea of allowing IE to look different to modern browsers. That is especially the case if the site you are building is an intranet with a 90% IE user base.\n\n[Autoprefixer](https://github.com/postcss/autoprefixer) is able to help out a lot in terms of getting IE11's version of CSS Grid to behave almost like modern browsers do. Unfortunately we are still stuck with IE11 not supporting CSS Grid auto-placement. That is a major pain point for this industry and Gutter Grid sets out to fix that.\n\n### The solution\n\nGutter Grid is a flexbox based grid system for building fully responsive grid layouts with highly customisable gutters. These gutters are highly reminiscent of the CSS `grid-gap` property. So reminiscent in fact that that Gutter Grid gutters will line up perfectly with real CSS Grid gaps! Since this grid system is powered by flexbox and not CSS Grid, it works perfectly in IE11. Through Gutter Grid, IE11 has access to simple auto-placement grids with gaps (albeit with a different syntax). It even comes with a default set of media queries that may save you from having to write out some custom styles for mobile devices.\n\nEven though Gutter Grid is powered by flexbox, it features a legacy mode that, when enabled, adds `display:table`, `float:left` and `display:inline-block` backups that legacy browsers can fall back on. This will help prevent your site from blowing up even when viewed in those decrepit old IE8 and 9 browsers!\n\n**To read the full documentation go to https://dan503.github.io/gutter-grid/.**\n\nYou can view the change log on the [GitHub releases page](https://github.com/Dan503/gutter-grid/releases) or the [Gutter Grid website](https://dan503.github.io/gutter-grid/pages/15-change-log/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdan503%2Fgutter-grid","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdan503%2Fgutter-grid","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdan503%2Fgutter-grid/lists"}