Financial-Times / o-grid

Responsive grid system
http://registry.origami.ft.com/components/o-grid
94 stars 17 forks source link

Fluid grid where width is unaffected by nesting #32

Closed wheresrhys closed 9 years ago

wheresrhys commented 10 years ago

In a discussion with designer Paul it emerged that a supposition made by him, and possibly design at large, was that the 12 column grid would be something that everything on a page could be aligned to, even nested items. But:

|_|_|_|_|_|_|_|_|_|_|_|_|
|             |_ _ _ _ _|
|             |         |
|             |   x     |
|             |         |
|             |         |

In the area labelled x any subcolumns will have their width set using % (because of the fluidity requirement) and will therefore in general not be alignable to the page level 12 columns as their width will be based on the 5-column-wide parent.

My hunch is that it's not possible to fix this without adopting https://github.com/Financial-Times/o-grid-issues/issues/28 and https://github.com/Financial-Times/o-grid-issues/issues/27, but thought I would put it here to see if anyone has any other ideas

triblondon commented 10 years ago

I think it's actually somewhat dangerous to provide this feature. If you want something to be two cols of a five-col outer span, then you really ought to be using the outer grid to do it. If you are inside a cell, you don't actually know how many cols it is spanning because the outer span will change with the width of the screen, so if you had an inner div that you wanted to be 100% width all the time, you'd end up having to have different span rules for each breakpoint.

It's going to end up driving us bonkers trying to do that. Resetting to 12 cols inside each cell makes for a much simpler model.