
Bootstrap 3 RC1 - taspeotis
http://twitter.github.io/bootstrap/
======
nileshtrivedi
List of all cross-browser gotchas from the Bootstrap site:

\- Striped tables are styled via the :nth-child CSS selector, which is not
available in IE8.

\- IE and Safari don't actually support the <disabled> attribute on a
<fieldset>

\- Avoid using <select> elements here as they cannot be fully styled in WebKit
browsers.

\- If you add the disabled attribute to a <button>, Internet Explorer 9 and
below will render text gray with a nasty text-shadow that we cannot fix.

\- Keep in mind that Internet Explorer 8 lacks support for rounded corners.

\- Badges won't self collapse in Internet Explorer 8 because it lacks support
for the :empty selector.

\- Progress bars use CSS3 transitions and animations to achieve some of their
effects. These features are not supported in Internet Explorer 9 and below or
older versions of Firefox. Opera 12 does not support animations.

\- Firefox persists the disabled state across page loads. A workaround for
this is to use autocomplete="off".

It would be nice to see if any progress is being made on these.

~~~
ricardobeat
Bears repeting: IE8 is at < 8% global share, < 5% in many markets, and
effectively 0% for any tech-related business. Google has dropped support
almost a year ago. Mobile and Safari are way bigger concerns.

~~~
TylerE
Careful now. If your user base is "normal" people it might be substantially
more than that.

One site I run is a local news site (East Coast, USA) that does a fair amount
of traffic (~10M pages, ~500k visitors monthly), and IE8 is still hovering
around 13% for us, with IE7 at just over 2%. In fact, IE8 > IE9, by a fair
margin. The good news is that IE share overall is down substantially.

Jul 2010: 74% Jul 2011: 65% Jul 2012: 58% Jul 2013: 34%

~~~
taspeotis
The industry I'm in has very non-technical users and businesses. Last time I
checked our telemetry it was reporting that 40% of our customers were on XP
and 30% used IE8.

~~~
walden42
Which front-end would you suggest for non-technical users (for compatibility)?
Still bootstrap 2?

~~~
taspeotis
Well in my case the lowest I need to go is IE8, which both Bootstrap 2 and 3
support. If you need to go lower, BS2 has support for IE7.

Foundation 4 has some caveats when it's being used with IE8
([http://foundation.zurb.com/docs/support.html](http://foundation.zurb.com/docs/support.html)).

Personally: I'm quite unfamiliar with Foundation so I'd go with Bootstrap 2 or
3. If I had to do it for work I'd go with BS2 because it's stable. Otherwise
BS3.

~~~
walden42
Thanks for the advice. GAnalytics shows 3% IE7 users on a couple of my sites,
and nearly 3% for IE6 on one of them =\ I'd rather support IE7 than not, so
I'll go with BS2.

------
davidw
I love bootstrap, but I'm completely unconvinced about the flat trend.

My site, www.liberwriter.com is squarely aimed at non-technical people who are
not really on top of the latest trends. I could very easily envision them
having a higher cognitive load trying to figure out what is a button and what
isn't and so on.

What do testing and studies show about this?

~~~
Gigablah
Bootstrap is a, well, bootstrap. You're supposed to build upon it, so having a
"flat" base makes sense since it's less hassle to add CSS properties (and give
your buttons some bevels) than override existing ones.

~~~
davidw
While it might not be much "hassle" in terms of adding some code, the part I
appreciate most about bootstrap is that it's put together by competent
designers and looks good as a whole. Once I start f'ing around with individual
bits and pieces, my guess is that things are going to go to hell in a
handbasket in short order, which sort of defeats the purpose of the whole
thing in the first place.

Also, my guess is that the flat base is there because that's what's cool these
days. Which isn't necessarily a bad thing: for a lot of people, having
something that looks modern and recent is pretty important too. Just that I'm
worried about it, a little bit.

~~~
ryanSrich
You should never rely on the styling for a public facing website. Sure, if
you're building a side projects or perhaps even an MVP, go for it. However, if
you're building a site to service a market, whether it be selling something,
publishing something, etc. you should always go with a unique design.

Bootstrap is great for having some underlying architecture but the visual
styles should rarely be used. Keeping the original bootstrap style says a few
things about you and your product: You're either lazy, poor at design, or
don't care enough to hire a competent designer.

~~~
scotth
Entirely unconvincing argument. Uniqueness of design isn't necessarily as
important as you make it out to be. Most customers would not even notice.

~~~
djrobstep
Indeed. In fact, being directly instructed by the client to copy their
competitor's website happens more than some people might think.

------
aaronbrethorst
Cue a dozen comments about flat buttons.

This looks like a nice set of changes for Bootstrap. I'm not sure how I feel
about the grid class name changes, but then again, I went all-in on Foundation
a few months back, so it doesn't affect me one way or another.

I'm sure mdo and fat have excellent reasons for using Less instead of Sass,
but I'm a Rails user and I like Sass better to boot. Anyway, no matter, I'm
glad to see Bootstrap is continuing to push forward!

~~~
taspeotis
I've inherited a web application that's held together with invalid HTML and
riddled with inline CSS. Got the green light to redo it all.

Replacing all the markup has been on hold pending BS3 (the mobile-first aspect
of BS3 seems a big win over BS2), but while waiting I've seen _a lot_ of
people talking about Zurb Foundation and its "superior" grid system.

From a purely HTML5+CSS3 point of view, what do you think of BS vs. Zurb?

~~~
aaronbrethorst
Clearly, I can't speak to BS3, but the thing I like most about Foundation is
the mobile-first grid: build your grid layout using Foundation's 'small- _n_ '
classes and it just works on larger screens too. If you want to develop more
complex layouts for larger screens, all you have to do is append 'large- _n_ '
class names (and now 'medium- _n_ ' exists, too).

~~~
johnny22
bs3 is mobile first also

~~~
hnriot
That's interesting to read, beccause on my iPad 4 BS3 is very sluggish.
Buttons visibly wait to show any change, menus the same. I don't have this
problem with BS2. Maybe when it ships this will have been eliminated.

~~~
zw
Hm, I'm experiencing that as well (probably to somewhat less extent) on a
mini. Very strange.

------
baddox
It has all sorts of bugs in Safari on my iPad. Switching screen orientation
and zooming out cause the left sidebar to cover up the body text, I can
sometimes get it to stay zoomed out way too far, and if I try to zoom in
Safari crashes every time. Looks very slick though.

~~~
freyr
Same here, and it jumps around as I scroll down a long page such as
[http://getbootstrap.com/css/](http://getbootstrap.com/css/)

~~~
g8oz
Also buggy on Opera 12 in Linux.

~~~
alternize
the collapsed navbar has several problems on Chrome (beta) for Android as
well, f.e. when zooming, or scrolling while the menu is in the expanded state

------
buro9
For those wanting to try out Bootstrap 3 against an existing Bootstrap 2
site... note that if you use anything other than 12 columns that it won't work
yet.

Simply: The grid is hard-coded to be 12 columns.

If you want more or less, then you need to adjust less/grid.css manually and
reflect that in column count within less/variables.css and use grunt to
rebuild.

Aside from the generation of custom grids being broken, no complaints about
the rest and we've been following the bleeding edge for several months now and
it's been fine. Yeah a couple of things have broken, but every change has been
an improvement and that's a good thing.

------
rushabh
We have built the new version of our web app on BS3. The migration from BS2 to
BS3 was not too difficult. There are some new elements too like List View and
Panels. Love the flat UI too. Feels very modern and light. Here is a demo of
our app: [http://demo.erpnext.com/](http://demo.erpnext.com/)

------
tlongren
[http://blog.getbootstrap.com/2013/07/27/bootstrap-3-rc1/](http://blog.getbootstrap.com/2013/07/27/bootstrap-3-rc1/)

------
taspeotis
The documentation makes reference to an announcement on the blog, which
doesn't seem to be available. If anybody wants to keep watch, be my guest:
[http://blog.getbootstrap.com](http://blog.getbootstrap.com).

I've been keeping an eye on the pull request
([https://github.com/twitter/bootstrap/pull/6342](https://github.com/twitter/bootstrap/pull/6342))
and the gh-pages branch ([https://github.com/twitter/bootstrap/tree/gh-
pages](https://github.com/twitter/bootstrap/tree/gh-pages)) for other
Bootstrap 3 information.

[http://twitter.github.io/bootstrap/customize](http://twitter.github.io/bootstrap/customize)
strongly suggests there will be another RC after this one.

~~~
markdotto
Indeed there will be at least one more RC.

~~~
taspeotis
Hey mdo, big thanks for all your work! I've used Bootstrap in one project and
will use it in many more.

It's a huge productivity boon and the documentation does a great job of
showing you what to do.

~~~
markdotto
Awesome to hear, yo! <3

------
Techasura
Just remove the "-dist" from the url or here is the download url:
[https://codeload.github.com/twbs/bootstrap/zip/v3.0.0-rc1](https://codeload.github.com/twbs/bootstrap/zip/v3.0.0-rc1)

------
arocks
I think Flat design is good from one perspective - easier to win client
acceptance. The original Bootstrap is so familiar to everyone.

Even non designers have a Deja Vu feeling - "Oh, this is a very cookie cutter
look. Can we get something more distinctive?". Of course there are excellent
sites [1] which help in tweaking the base design but takes a lot of work.

Flat designs can be much more easily customized and developers can spend more
time focussing on the functionality than the design.

[1]: [http://bootswatch.com/](http://bootswatch.com/)

------
k-mcgrady
I'm launching a site in a few weeks which uses Bootstrap 2. Should I upgrade
to Bootstrap 3 now or wait until the final version of 3 is released?

~~~
ayi
Bootstrap 3 is mobile compatible "out of box". but dropping of IE support can
cause troubles on your side. you should use respond.js to use media-queries on
IE8 and below. despite this, i'm using it since april and everything is ok.

~~~
k-mcgrady
Thanks, I started the change from 2 > 3 today and it hasn't been too painful.
The main things were changing to the new grid system and searching the docs
for some classes that had been renamed

------
jdorfman
Now on BootstrapCDN for reals

------
killion
I find it funny that their examples of grids don't line up on the right side.

It totally speaks to my experience with their grids.

------
dreamdu5t
The modal is still not responsive. I've been using
[http://jschr.github.io/bootstrap-modal/](http://jschr.github.io/bootstrap-
modal/) and am kind of disappointed that the new version isn't improving
existing widgets like this.

~~~
markdotto
Actually it is—it might behave perfectly right now, but the intent is that it
is mobile-first and responsive like nearly every other component. If you're
running into problems, let us know though via issues. <3

------
ereckers
I'm happy about the mobile first approach. Simple things like 100% button
widths is great. This was a modification I had to make to every Bootstrap site
I built. I like the idea of having a single CDN for it too. Nice work.

Oh, I owe it to the thread - flat buttons.

------
pgsch
The main problem I'm having with the bootstrap flat design is how to
difference between button and (e.g.) labels/badges. In the previous version
(2.x..) it was pretty clear for the user that a button was a button...

------
wojt_eu
Flat or not, this is how I feel about UIs built by programmers before
Bootstrap was available:
[http://www.youtube.com/watch?v=-MC7GrDS8TE](http://www.youtube.com/watch?v=-MC7GrDS8TE)

------
marizmelo
Well just use xtyle instead:
[http://xtyle.xchema.com](http://xtyle.xchema.com)

It's smaller and uses CSS property names as class names. You know CSS you know
how to use it.

~~~
kaeruct
What's with the broken english on their website? Just a heads up.

Looking at the framework, it looks neat and more concise than bootstrap, I
might use it for my next pet project.

------
jonaldomo
I've been waiting for the dropdown events that were added. I started a project
in Zurb Foundation today due to Zurb having the upper hand in responsive, time
to reevaluate it looks like...

------
pseudobry
[http://getbootstrap.com/](http://getbootstrap.com/) looks like it got its
design from Heroku's new website.

~~~
markdotto
We've always used purple, save for the months of red in the v3 dev work that
we then changed just a couple days ago. The purple was pulled directly from
[http://static.djbooth.net/pics-tracks/asaprocky-
peso.jpg](http://static.djbooth.net/pics-tracks/asaprocky-peso.jpg) :).

------
hemezh
Finally bootstrap with flat UI. Loved it. Looking forward to use it in my next
project. Does that mean twitter might also launch a flat UI soon?

~~~
markdotto
Thanks! And no, probably not—the two are most definitely not directly related.

------
lenkite
The Bootstrap grid system now appears crazy complex to me. I really wish all
browsers would now support modern CSS3 Flexbox.

------
xSwag
Didn't know advertisements were allowed on github pages, I guess the
developers have to monetize somehow.

------
natch
I get "Not Found" upon clicking the big main call to action, the Download
Bootstrap link.

------
joeblau
Congrats guys, I've been following the RC1 branch for a few months now and
this looks great.

------
thomasfoster96
Flattest thing I've seen today.

------
tednash
Bootstrap is utterly brilliant in terms of validating an idea and indeed
scaling one.

------
timkeller
Congratulations on reaching RC1 after more than seven months of intensive
work.

------
conradfr
Side menu (links) doesn't work for me in FF or IE, only with Chrome.

------
zekenie
I kind of love the new form markup. It makes more sense to me than BS2.

------
ing33k
just tried replacing the css files with the new ones , navigation and many
things broke ..but any how I like it, I will integrate it after checking out
docs ..

------
rch
Seems like navigation might be broken on the Nexus 7.

------
mangaprincess
so0o0 do we have a gem yet

~~~
sergiotapia
I've always wondered people like using a Gem. It's better for me to just write
in a bootstrap.css file in my assets folder and add it to the application.css
tree.

Why add another point of failure on your site?

------
gcatalfamo
is it just me or it feels somewhat sluggish on mobile? (nexus 4)

------
hackapreneur
They weren't joking when they thought the world was 'flat'.

------
PaulHoule
that page seemed to load in a microsecond, wow!

------
gugol
I love it! But it's not Bootstrap, it's something very different. They
shoulded name it different or keep maintaining the older version...

~~~
BaconJuice
How is it not bootstrap? If anything it's more bootstrap now.

------
emn13
So what exactly is the point of bootstrap? It includes an entirely pointless
(and poorly made) grid system; an excessive (and unnecessary) css reset;
complex & slow selectors, and lots of default styling you're probably going to
replace anyhow.

If it were a bunch of separate modules you could individually include and use
as a template for your own style, you could actually use the parts you need:
as it is, I really don't understand the hype.

~~~
sorich87
_If it were a bunch of separate modules you could individually include and use
as a template for your own style, you could actually use the parts you need_

Version 3 is very modular. You can compile the LESS files yourself and include
only what you need.

~~~
Throwadev
You could already do that with 2.x too. I did this with a site that I built
using bootstrap 2.3. No one knows that site is bootstrap until I tell them we
used it. We made our own bootstrap.less file that only pulled in the .less for
the modules we needed, so we could minimize the bloat.

Also, bootstrap uses normalize now, not reset. This poster should make a
little more effort to understand before criticizing. It's obviously a useful
framework as many find it very useful. Coding and html css for a complex is
not something a developer wants to do unless they have very, very good
expertise in front end development. I think bootstrap is great for developers
who aren't front end experts, but aren't necessarily bad developers. Maybe
specializing in back end work, database, web server side stuff. Using
bootstrap frees you up to focus on things that matter more for your app, and
you don't have to worry about typography, typeahead, grid systems, etc. It's
one of many options that satisfy this need, such as Zurb's Foundation.

~~~
emn13
I use bootstrap. I'm disappointed with 2; although perhaps 3 is better.

I guess if you don't know css I can imagine it's a godsend: bunt frankly,
basic css isn't that hard, and most of boostrap is easy to duplicate with
basic css (except perhaps the media queries).

Anyhow, I don't think bootstrap doesn't have good stuff; I think the way it's
presented as some kind of "system" is a bad idea. It's doesn't work well as a
system. It works well as a basis when someone takes the time to pick and
choose what they need.

You can't just take bootstrap AND some other css, use them both together, and
expect both to work orthogonally without a lot of care. They will stomp on
each others selectors and you'll have a specificity war on your hands. How can
you make this work? By actually picking, the bits you need, and doing more
than a modular concatenation with whatever other css you need.

Basically: it's a great css example, not an encapsulated, finished module.

When you say: "No one knows that site is bootstrap until I tell them we used
it" that tells me you customized it, and that's exactly how it should be. It's
not a reusable component, it's a customizable template.

------
alixr
I've never been a fan of bootstrap, namely because nobody modifies it and all
websites end up looking the same.

But I will say its nice that they're going Flat. Much easier on the eyes, and
much simpler to creative a responsive layout for multiple screen sizes.

