Giter VIP home page Giter VIP logo

Comments (2)

stubbornella avatar stubbornella commented on July 28, 2024

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

from oocss.

jaabert avatar jaabert commented on July 28, 2024

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?

from oocss.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.