Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Grids_gutter.css how to use them? #160

Open
jaabert opened this issue Jun 7, 2013 · 2 comments
Open

Grids_gutter.css how to use them? #160

jaabert opened this issue Jun 7, 2013 · 2 comments

Comments

@jaabert
Copy link

jaabert commented Jun 7, 2013

I 'm updating my OOCSS project with new features like grids_gutter.css.
I like the idea to include gutters in OOCSS, but I'm not sure how to handle them.

It's not only about link and activate the file, because the layout don't seems work properly.
Example:
1/5,1/5,1/5,1/5,1/5
Renders a 5 column layout, but with grids_gutter, last column falls down to the next line.

So, I keep testing gutters and post results, but meanwhile ¿There is some documentation about this feature?

@stubbornella
Copy link
Owner

I'd recommend switching to base 12 or 24 grids, rather than using 2,3,4,5ths like the older version of grids. You can do that by adjusting the values for grids related variables in variables.scss. 

​If the lastCol isn't staying where it should you might be missing the lastCol class?

Can you show us the code you are using? 

Grids are documented in the library files generated by make build or make watch.

​Nicole  


Sent from Mailbox for iPhone

On Fri, Jun 7, 2013 at 9:31 AM, jaabert [email protected] wrote:

I 'm updating my OOCSS project with new features like grids_gutter.css.
I like the idea to include gutters in OOCSS, but I'm not sure how to handle them.
It's not only about link and activate the file, because the layout don't seems work properly.
Example:
1/5,1/5,1/5,1/5,1/5
Renders a 5 column layout, but with grids_gutter, last column falls down to the next line.

So, I keep testing gutters and post results, but meanwhile ¿There is some documentation about this feature?

Reply to this email directly or view it on GitHub:
#160

@jaabert
Copy link
Author

jaabert commented Jun 11, 2013

I found the variable grid columns in variables.scss. That file and docs in library it's quite enough to start in OOCSS grids layout.
Unfortunately we are still working on components of the previous version, so I will continue to review all components of our project before moving to the new version.

In any case, thanks for the info. I located the documentation and apply it in our project ASAP.

Frankly, we had to find a solution to the layout divisions in prime numbers, columns 7, 11 ... Later I found that OOCSS added a similar solution too, before going to sass scripting. Now I'm glad to see as OCSS evolves and is highly reliable. I hope to talk about the new layout style in the future.

PS: I do not use the lastCol or lastUnit class, it is a personal choice and a team decision with my teammates. As there are no margins in the old grid, the space always corresponds to certain percentage specified in the corresponding unit size. In any case, I think the automatic size ( "auto"), which adds class lastUnit (lastCol too?) is a good resource for items to be resized, based on the information they contain, but is not the basis for a layout documents, where information should flow within the predefined model.

We use width:"auto" in the last item of a menu, last item of a table row, and similar structures where we need to keep the information items as together as possible.

In my previous example:

<div class="unit size1of5">
<div class="unit size1of5">
<div class="unit size1of5">
<div class="unit size1of5">
<div class="unit size1of5">

We could have applied "lastUnit" to the last column, however we would have lost the homogeneity of the model (layout), so I decided to do without the gutters until we move the entire project to the new versions.
Thanks for your interest in our doubts.

On the other hand, I see that OOCSS are starting to look at other frameworks, Foundation, Bootstrap,... in this particular case, the grids.
On one hand I'm happy, it's easy to learn, but partly also believe it can lose originality if simplicity and versatility in layout tools are too focused on making "reading" layouts like blog, magazine, newspaper, etc. ...

¿What do you think about that?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants