Menu
Is there any CSS grid system that supports full viewport width? Most Grid System seem to just intend a width of 960px up to 1140px. This is the most deployed width for a normal User(as the most people are using 1280px × 1024px).
My purpose is to have a responsive layout for Users using even a FULL HD Resolution(1920px × 1080px).
If there is a better/more simple way to make it, pls let me know
295
The supporting browsers Other than in Internet Explorer, CSS Grid Layout is unprefixed in Safari, Chrome, Opera, Firefox and Edge. Support for all the properties and values detailed in these guides is interoperable across browsers.
You should not use it just because it works but because it's meant to solve your use case. The support for Grid's basic functionality is around roughly 95%. That is amazing news. We can assume that it's production-ready.
By default, a grid item cannot be smaller than the size of its content. Grid items have an initial size of min-width: auto and min-height: auto . You can override this behavior by setting grid items to min-width: 0 , min-height: 0 or overflow with any value other than visible .
Grid is better at overlapping. Getting elements to overlap in flexbox requires looking at traditional stuff, like negative margins, transforms, or absolute positioning in order to break out of the flex behavior. With grid, we can place items on overlapping grid lines, or even right within the same exact grid cells.
Twitter bootstrap fluid grid system works with percentages : http://twitter.github.com/bootstrap/scaffolding.html#fluidGridSystem
There is also a lot of pure css responsive grid system, for exemple : Skeleton
This article covers a lot of them : http://speckyboy.com/2011/11/17/15-responsive-css-frameworks-worth-considering/
It's possible to do that yourself, using percentages for css width, media queries and js fallbacks (as media queries aren't fully supported).
But those grid systems will save you times and headaches as they are for the most well tested.
To help your decision, you should consider :
span4), chose the one you prefer,
some of them are more semantic than others, it's up to you. Also, this site is a most for responsive inspirations : http://mediaqueri.es/
145
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
