The Grid about base

[hejamartin]

Hi,

I am just starting up with this base - so this is awesome. But the docs does not really tell me so much - you got row-3 and so which seems to be useful, but they are gone from the SASS file.

Well, i will probably manage that by my self, but I guess you are working on many things as well, and not only this.

[matthewhartman]

Hey Hejamartin,

I took out the row classes because I was trying to minimise the base ;)

I just added one .row helper to keep it lean and clean.

Let me know what you think.

Cheers.

Matt

[hejamartin]

It works good without the extra row-helpers, I see that it is better to take a look inside style.scss than in the documentation at the moment. Good move.

I just discovered the class .container-full, in which I think should be instead of the container really.
The container has its padding, in which makes the 960->940 to be 930. And the 940px is already what I would assume is a good width, and having 10px extra of margins.

Here is a screenshot.

You see that the three col-1-3 and the col-12 does not add up in width, and that seems cumbersome to me. Am I dealing with this the wrong way?

[hejamartin]

Oh, I guess it has to deal with the 33% *3 = 99% of course.
And I am not to blame you, more perhaps that there are some round-of errors and other browser-issues.

But nevertheless, what is your thoughts. Some designs needs the layout as the one above, and to have it "pixel-perfect" with alignment and so. But maybe there is no solution in a neat way to solve this?

You do use decimals on other columns, but on the col-4/col-1-3 there is only 33% given?

[hderaps]

Love your work Matt, I have been using Base for quite a while. So what made you change the grid system and move away from col seven to col col-7? Why did you opted for a padding instead of an actual gap between columns? I can see the addition of Push and Pull which is nice.

[matthewhartman]

Hey Hugues,

Thank you for your positive feedback.

A few people made the comment that it was hard to visualise building there grid using words and said it would be a lot easier to use number (which makes sense) - hence the change.

I've changed from margin to padding as the grid is using box-border sizing, hence it's easier to calculate column widths.

Let me know if you have any further concerns.

Cheers,

Matt

[matthewhartman]

Hey Guys,

Apologies for the late reply. I have not been getting emails when people are commenting on the issues (even though I have email notifications turned on).

Anyway, it looks like you guys found a few issues with the grid columns not rounding correctly.

I can work around this problem with the following:

1. Change desktop columns to be hard coded px sizes
2. Make the last column float right to fill the space, but keep in mind the margin space will be slightly larger for the last column

Let me know your thoughts for the above.

Also, keep in mind that due to the nature of responsive web design, the pixel perfection approach is out of the window ;)

Cheers!

Matt

[matthewhartman]

Hey Guys,

I've found out how to fix the percentage issue cross browser with pure CSS!

Going to do some more testing to ensure it's 100% and push the changes through.

Cheers!

Matt

[filljoyner]

Great work!

On Friday, April 4, 2014, Matthew Hartman [email protected] wrote:

Hey Guys,

I've found out how to fix the percentage issue cross browser with pure CSS!

Going to do some more testing to ensure it's 100% and push the changes
through.

Cheers!

Matt

Reply to this email directly or view it on GitHubhttps://github.com//issues/14#issuecomment-39621066
.

Philip Joyner
[email protected]
@filljoyner