search

gss / engine

GSS engine
http://gss.github.io
MIT License
2.87k stars 104 forks source link

Is it possible (and valuable) to layout a data table with GSS? #190

Open drewbeck opened 9 years ago

drewbeck commented 9 years ago

I'm trying to get GSS to layout a data table. I've tried a variety of approaches including using plain classes on my elements (.row, .cell) and using numbered classes with splats (.row1...10, .cell1...10). VFL. No VFL. I can't get it to work.

The standard table rules are what I'm looking for: rows stack vertically, cells horizontally. All cells within a column are the same width.

Is this possible? Perhaps more importantly: is this valuable? Am I better off using a combination of GSS and standard CSS/DOM flow?

I'm approaching this as someone who has long been frustrated by the lack of control over layout for data tables. The traditional methods fall down for me a fair amount in the work I do and I'd love more fine-grained control over how the table expands or contracts as the data and the window resizes.

paulyoung commented 9 years ago

@drewbeck would something like this work for you?

http://codepen.io/paulyoung/pen/QbpmQN?editors=110

mudgie commented 8 years ago

Hi Paul, you're a life saver, I've been trying to make a responsive grid without much luck and it looks like this will do the trick! Just a quick question (if you don't mind): how would I go about inserting this into a fluid width div rather than have it take up the whole window width? I've been trying, however if I set a width on it, it goes a bit bananas and positions itself in odd locations and stretches out the page.

paulyoung commented 8 years ago

I would probably use in(^#fluid) instead of in(::window).

You might need to make the fluid div have position: relative;.

Also, be aware of https://github.com/gss/engine/issues/198.