

The new Bootstrap 3 grid system - trumbitta2
http://www.williamghelfi.com/blog/2013/06/09/bootstrap-3-the-new-grid-system-for-starters/

======
pzxc
The thing I hate most about bootstrap 3 is changing the class names of the
grid. "span3" and "offset1" were much better than "col-lg-3" and "col-
offset-1".

Seriously... there are several places in the docs (and I often do this myself)
where a non-grid-related element uses a "span2" or whatever to float itself
left and size itself equal to a 2-width column. Example: the input field for a
search box. When input-medium/small/mini/large/xlarge doesn't cut it, or just
because you want something to fit in a column.

So now we're gonna have "col-lg-2" etc plastered throughout our html? I don't
see that as an improvement. The elements that get used the most should have
simple names... that's what made bootstrap great as it was a common-sense
standard for lots of common html/css techniques. "hide" for display:none,
"muted" for color:#999, etc.

~~~
vec
I'm guessing that it's stealing the small and large grids from Zurb
Foundation.

~~~
liquidise
My thoughts exactly. Foundation has always had a superior responsive grid
layout, if for no other reason than it is embed-able within itself. To say
nothing of their push and pull column classes.

------
egypturnash
Bootstrap 3: Because deep in your heart of hearts, you still miss using tables
for layout.

~~~
trumbitta2
This is true, in a way.

Tables were great in that they were a solid grid system, and a responsive one
( if you didn't try too hard to make them break your layout ).

But tables are for displaying tabular data, and they have some unwanted fat
(th elements and the like) in regard to using them for a layout.

Now we are at grid systems. So much better!

But what we _really_ want is native CSS support for complex layouts ( maybe in
a couple of years... )

~~~
rraval
What you really want is CSS template layout:
[http://www.w3.org/TR/css3-layout/](http://www.w3.org/TR/css3-layout/)

~~~
trumbitta2
Exactly. Now it's browser vendors turn :)

------
kaoD
I always wondered: why use a grid system when it's essentially a table, which
is already implemented in browsers and fits the purpose of grids perfectly?

Is it just because it's not semantically correct? Neither is a grid system.

Is it better for responsive designs?

~~~
mgkimsal
Grids would generally be worse - no semantic info like 'thead' or 'axis' in
grids/divs. That said, I'm a bootstrap span fan and don't like this extended
naming from the article - reminds me of YUI grids from several years ago.

But hey, "they're' not tables - tables are evil!", right?

RANT: I worked with some people ... sheesh - almost a decade ago that
proclaimed "tables are depreciated" (I'm pretty sure they meant 'deprecated')
and spent days having a team of people convert tablular data from Excel
spreadsheets in to bloated DIV-hell for IE5 and NS4 browsers. That's been my
worst experience with table-haters, but it stuck with me.

~~~
andybak
Could you not just send them a link to the specs? (and a dictionary)

~~~
mgkimsal
I didn't last too long there, and thankfully I wasn't on that team directly.
Yeah, pointing out things like 'facts' with 'evidence' doesn't make you a
'team player' very often. Yes, there's the issue that I'm the new guy, but
really... there are some things that are objectively true. HTML tables have
never been 'deprecated', have their place, and are perfectly fine. DIV-based
layouts are fine too, but knowing when to each is key, and displaying hundreds
of pages of spreadsheet-style data with inlined styles for each div is... just
insane. They had to do inlined styles on each div because some version of IE
didn't handle the formatting they wanted properly - some alignment issue -
when I pointed out that table cells already supported that formatting... I
think that's when I was no longer required to be involved in that project.

------
colinsidoti
He casually nested two "col-lg-6" within a "col-lg-9"

Isn't that a bit of big change? In the past, I don't think we could get two
equal size cols filling up a 9.

~~~
trumbitta2
Actually that's about the biggest change: Bootstrap 3 is Mobile First and the
grid is fluid-only.

Pros: you can nest the hell out of your layout without putting your brain on
fire.

Cons: didn't find one, so far.

------
baby
I'm reading through this and I see bootstrap has became like Foundation a lot
:

* You have mandatory #container div

* you can nest rows by default (previously you had to use fluid-row)

* they got rid of "span" and use the more natural "col".

* offsets

* push & pulls

Foundation still have more : "ending cols" for number of cols not reaching 12
and centered "cols".

I'm liking it. I would have gone for Foundation 4 but I'm wondering if I
should try this new Bootstrap for my next project.

------
MWil
I'll tell you what I really like about this. If you have a setup where
information in the right column is providing clarifying information about what
is on the left (NOT vice versa)...

Based on the responsive design of the grid, if you resize the window smaller,
it puts the "context" directly underneath and you can offset based on color.
That's at least based on a 2 column system. I haven't tested it on multiple
sets yet but it works for what I need it for.

------
conradfr
Gutter-free grid ? Can be good as I always found gutters too wide in grid
systems.

~~~
pdog
They're already configurable variables in LESS: just change @gridGutterWidth
etc.

------
cletus
My one desire for Bootstrap is to have more than 12 columns. That's too
coarse-grained IMHO. Why not 24? I know you can do this yourself but in my
experience it results in weird bugs.

I also agree that span3 and offset2 are/were better names.

Still, Bootstrap is awesome, even in spite of the ASI BS it's authors
maintain.

~~~
baby
The point of the 12 columns is it can be divided by 3, 2, 4 and 6. What would
be the point of 24 columns grid?

If you need to display 24 items in a row, then you shouldn't have to mess with
the foundations. Use CSS or tables.

~~~
dm2
I've found the need for a "half" column several times. I like the idea of a 24
column grid.

~~~
baby
Good point!

------
krakensden
Nice to see screenshots from X11, every once in a while.

------
thesorrow
The only grid system that get things right is susy
([http://susy.oddbird.net](http://susy.oddbird.net))

~~~
rcsorensen
Could you clarify what Susy gets right that Bootstrap, Zurb, and 960 don't?

