Home › Forums › Other › grid system feedback › Reply To: grid system feedback
Okay, I’m trying not to get too fragmented, here. This is a design (in the engineering sense) oriented question and will apply to either the table or inline-block based plan. Plus, I am writing this as a sass module, so in the end I’ll be able to use it how I like regardless of what I choose here.
As you’ve seen in the demos, I am using a “x
ofy
” attribute value scheme for predefined column widths. “1of4” would be 25% wide, “6of12” would be 50% wide, and so on. I am planning on predefined y
values of 2-12, or maybe through 16, and x
values from 1-y.
My original idea was to make the system mobile-first, with all columns having 100% width by default and then getting their “grid” widths at a certain breakpoint.
Now, this is how I got trapped by my own logic:
Should a “x
of4″ column become full-width at the same breakpoint as a “x
of16″ column? Probably not, right? So, here’s a new idea: three or four breakpoints, and they kick in for different rows based on the y
value. So, “1of4” and “3of12” are both 25% wide, but they switch to their “mobile” (full-width) display at different breakpoints.
From there, it only makes sense that you could assign multiple values to a column, maybe like “1of2 1of4 1of12”, and have each break at a different point: so on large screens the column would be 8.33% wide, on mid-size screens this same column would be 25% wide, 50% on smaller screens, and full-width on very small screens.
From a technical standpoint, I like this very much, and I have figured out how to do it. My question for all of you is whether anyone thinks this is worth it.
- Would you like a grid system that give this kind of fine control? would these features see much use?
- Since it is sass and you can do it any way you want manually, do you think it is useful to have this kind of system predefined?