
Bootstrap 3 released - trumbitta2
http://blog.getbootstrap.com/2013/08/19/bootstrap-3-released/
======
bluetidepro
> _" With v3, we've gone flat. Don't call it a trend—it's all about
> customization, folks."_

I hope everyone catches that part of the post. It's very important, I think,
based on the previous HN thread comments.

I've been quite surprised at how many people are in an uproar about v3 being
flat. People have been saying things like "it's a dumb trend", "horrible UX",
"so ugly", etc. For a skeleton starter template like this, flat is good.
Having the design flat encourages you to build on it or theme it to your OWN
style so all of the sites using Bootstrap don't end up looking the same (like
they have in past versions). It was also annoying in past versions when you
had to declare no gradients, or reverse engineer things to lose the "default
theme". Making it flat now allows you to build up, where past versions made
you go backwards first, then build the theme the way you wanted. I hope more
people realize that rational now they have specifically called it out.

With that said, well done everyone that helped on the project! Great work! :)

~~~
davidw
> Having the design flat encourages you to build on it or theme it to your OWN
> style so all of the sites using Bootstrap don't end up looking the same

I don't want to build on it. My customers don't care that it looks like other
sites, they just want something that looks professional and is easy to use,
something which Bootstrap 2 does _way_ better than I could do alone, and for
which I am eternally grateful.

My customers range from a little to _really_ non technical, so I think that
"making them think" about what might be a button and what might be a label is
a regression.

So if I want to upgrade, it's not just "encouragement" to customize, it's a
necessity, and I consider it added work since I did not have to do it with the
previous version of Bootstrap.

Hopefully, the theme mentioned in the article will suit my needs.

> With that said, well done everyone that helped on the project! Great work!
> :)

I can agree with that! I am very thankful for Bootstrap.

~~~
bluetidepro
I completely understand what you are saying, and they have already solved your
problem. You can still easily grab the V2 theme to lay on top of V3 to
generate all those pre-done styles. The beauty is that it's no longer forced
in V3 for people that do want to build up, like it was in V2. It's a win-win!
;)

As tsurantino said in another comment, see here:
[http://getbootstrap.com/examples/theme/](http://getbootstrap.com/examples/theme/)

~~~
davidw
Yeah, it's probably good enough, although it still seems kind of flat-ish:

[http://getbootstrap.com/2.3.2/base-
css.html#buttons](http://getbootstrap.com/2.3.2/base-css.html#buttons)
compared to
[http://getbootstrap.com/examples/theme/](http://getbootstrap.com/examples/theme/)

It was kind of them to make the extra effort though, for those of us who are
happier with the older look and feel. Just a bit more like actual _buttons_ ,
and it'd be perfect.

~~~
lowboy
The button gradients are toned down a little, but they're still there. It's
still closer to the v2 style than it is to flat.

------
phillmv
You can't actually see all the left-menu items on
[http://getbootstrap.com/components/](http://getbootstrap.com/components/) on
a 13inch screen.

~~~
STRML
I can't see all of them on a 1080p screen at 125% zoom, either.

~~~
ZoF
If you scroll to the bottom of the page the sidebar will eventually scroll
down and show them. Still an error though, and the irony, given the context,
makes it a bit comical.

------
LinaLauneBaer
Edit: Oh. I have just found out by another HN post that I did not understand
the new grid system... Here is a link that explains it very well:
[http://www.helloerik.com/bootstrap-3-grid-
introduction](http://www.helloerik.com/bootstrap-3-grid-introduction)

I have used the release candidates for my own personal website and it has been
a pretty good experience. However I liked the result I got with Bootstrap 2
more.

To say it upfront: I am not a web developer. I am doing something completely
different professionally. But maybe that makes my experience with Bootstrap
kinda interesting… :)

I had the main problem with the mobile first grid system. It changed quite a
lot when compared to Bootstrap 2. I made a product page for my new app and I
wanted to show thumbnails. When using the built in thumbnail class wierd
things happen when you resize the window: The actual size of the thumbnail
changes and it gets distorted as a result.

Also the new grid system has the effect - at least in my case - that when
resizing the window, the overall width of the columns that contain my text
expand even though I made the window smaller. And then when I make the window
even smaller the columns containing my text are becoming less wide. I think
this is because of the fluid layout.

Personally I do not like fluid websites at all. Maybe I should not have used
bootstrap then but I had some experience with it… What I liked about the non
fluid grid system in Bootstrap 2 was that your website looked more or less the
same on desktop and on mobile. On mobile the first thing you would see is a
scaled down version of your website with the structure in tact. If you wanted
to see the details you would have to zoom in. Now Bootstrap tries to be smart
and transforms columns to rows… This is obviously good if you want a fluid
website.

When I had to do it again I would not use bootstrap again. Instead I would
look for something that has a grid system like boostrap 2.

------
davidw
Here's a question: what's the difference between this icon font, and font
awesome, which for a time looked to be the 'go to' way of doing icons? I have
no horse in that race, and they both look good to me.

~~~
highace
I just tried to swap in the new font-based glyphicon icons over the top of the
old image based ones.

First of all it's not a clean swap, because the class name structure has
changed. Secondly, the font glyphs seem to have totally random positioning, so
depending on how you use them you'll need to tweak the css for each one (or
certainly groups of them) so they align properly with the
text/button/whatever.

I reverted, and dropped in Font Awesome. It was as simple as changing one line
of css if you use the CDN, done. No tweaking required, and there's load more
to choose from.

~~~
kipple
I also have found Font Awesome to be an easy and comprehensive solution (mmmm
that huge icon selection, dang!). I honestly don't understand, why hasn't FA
been folded into Bootstrap? Is it some licensing thing?

------
ibejoeb
No submenus is kind of a bummer for applications. Sometimes I work on
traditional stuff with an audience that expects this kind of navigation.

I still really appreciate it, though. If it turns out I really need them, I'd
rather start with Bootstrap than have to start from scratch.

------
baby
Honestly this is the biggest point in Bootstrap 3 :

> box-sizing: border-box

I never understood why they didn't use it.

~~~
yelnatz
Bootstrap 3 paints 2x as fast compared to Bootstrap 2.3.

[http://www.youtube.com/watch?v=Z1IqzeA3XXg](http://www.youtube.com/watch?v=Z1IqzeA3XXg)

~~~
ssafejava
You're right, in my personal testing it does appear to be about 2x faster.

The big perf wins:

* Fewer box shadows

* Fewer gradients

* Fewer semitransparent borders (a big performance problem, especially in chrome - I've seen > 10x performance slowdowns when using rgba borders & border-radius: 0 - see Chrome's tracker [1])

* Simpler rules (fewer styles to cascade)

1\.
[https://code.google.com/p/chromium/issues/detail?id=170882](https://code.google.com/p/chromium/issues/detail?id=170882)

------
steveax
I'm just glad they kept table.table and label.label

The department of redundancy department can sleep peacefully tonight.

------
gavinballard
I've been working with the release candidates for a while for my Shopify-based
Bootstrap theme
([http://bootstrapforshopify.com/](http://bootstrapforshopify.com/)), and
while it's been a bit of a tough ride sometimes (with pretty significant
changes from release to release), I'm really impressed with what v3 brings to
the table.

Hopefully, the way the new styles are laid out will encourage more people to
treat Bootstrap as a starting point rather than the end game for layout and
styling (although it's a pretty good starting point in of itself).

Edit: And, of course, massive thanks to Mark and Jacob (plus the ever-
increasing community) for all of the work they've put in over the last two
years :).

~~~
markdotto
Yeah, sorry about those changes in the RCs. Really we used the wrong label and
are sorry about that. All in all though, everything with those pre-releases
worked out really well. Just a naming thing :).

And thank you! <3

~~~
gavinballard
Apologies not necessary :).

~~~
borton
I appreciate the apology. I updated a site on the assumption that RC1 was a
release candidate and not a work in progress. Now I need to update the site
again. Ugh.

~~~
random42
Release candidates are expected to have bugs!

I generally prefer using Major.minor.1 or Major.minor.2 of a new version (as
many more bugs get fixed in those versions, after the stable version is used
in production environment) or the last major version with all bug fixes.

~~~
borton
RC1 to RC2 was much more than a bug fix release!
[http://blog.getbootstrap.com/2013/08/13/bootstrap-3-rc2/](http://blog.getbootstrap.com/2013/08/13/bootstrap-3-rc2/)

------
scotty79
> Everything in Bootstrap gets box-sizing: border-box

Why w3c didn't make it default is beyond me.

------
philip1209
Bootswatch is in the process of updating its themes to Bootstrap 3 too:

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

~~~
johnward
I've never heard of bootswatch. I could see many people using this. One thing
bothers me on your page though. The header text is fixed with no background so
it ends up jumbled with the other text:
[http://cl.ly/image/3D133Y1E1V2P](http://cl.ly/image/3D133Y1E1V2P)

fyi I'm using chrome28 on osx 10.8.4

------
karsonenns
Now I'm waiting on a SCSS port of it.

~~~
movingahead
If you are looking for SASS and Rails, this port works great.
[https://github.com/thomas-mcdonald/bootstrap-sass](https://github.com/thomas-
mcdonald/bootstrap-sass)

~~~
markdotto
Yup, and we'll be working with these folks make this more official shortly.
Stay tuned!

~~~
Flenser
That's great, there are a couple of sass ports for 2 and it was time consuming
evaluating them so an officially blessed port would be great.

For those of us integrating it with web app where we use semantic class names
that we want to map to template styles, it would help if there were sass
versions that create no concrete styles, just mixins and placeholder styles,
so that we can extend our classes with bootstrap ones without inheriting
styles on elements where we don't want the bootstrap style. e.g. I wanted the
.nav-tabs style but already had my own .nav styling.

Do you have any plans to make it possible to extend from bootstrap in this
way?

------
jimaek
Get it from a fast CDN
[http://www.jsdelivr.com/#!bootstrap](http://www.jsdelivr.com/#!bootstrap)

~~~
clone1018
I prefer [http://www.bootstrapcdn.com/](http://www.bootstrapcdn.com/)

------
rmrfrmrf
I checked this out last night and noticed a bug in the nav bar in the
justified menu example (in Chrome, when you resize to sm and back to lrg, two
of the menu items seem to drop down and unstyle themselves). If the issue is
still up by the time I get to a computer, I'll submit an issue on Github.

------
weavie
Awesome. Does this mean no more breaking changes for vn 3? It's been a mad
game of catch up so far, every time I update I have to spend some time going
through and updating the html to use slightly changed class names.

------
spitfire
Odd error on Safari 6.0.5 here. Where you should have three column layouts in
the example page you get a single column list type layout. (Not a designer.)
I've disabled both adblock and clicktoflash plugins.

------
Kiro
Opening the mobile menu still lags a lot on my phone (Galaxy S3, stock
browser). Why don't they use CSS animations for it instead? I was really
hoping it would have been fixed in v3. Love the rest though.

~~~
skeletonjelly
No issues here both on stock browser and Chrome Beta (Nexus 4). Do you mean
the initial delay or rendering jitter?

~~~
Kiro
Rendering jitter.

------
benaiah
Looks quite nice - I really like the new theme, as it allows you to go for a
gradient look but appears much less intrusive than Bootstrap 2's theme, in
addition to being optional.

Better documentation is also a huge plus.

------
zerolinesofcode
Checkout roostrap too, one of the first Java web frameworks to support the new
Bootstrap 3

[https://news.ycombinator.com/item?id=6241294](https://news.ycombinator.com/item?id=6241294)

------
peferron
FWIW, migrating from a RC downloaded 2 days ago to this final release broke
some stuff, most notably related to glyphicons CSS - so if you plan on
upgrading, just be aware that it might not be seamless.

~~~
joshfinnie
I have found that `btn-large` changed to `btn-lg` during the release from RC
to today. So definitely take a look at this for larger projects.

------
bigbassroller
I'd like to see a collapse menu come from the left or right incorporated into
Bootstrap. Like the one at [http://purecss.io/](http://purecss.io/)

------
joeblau
Glad to see that Mark put the theme information is right on top :). Hopefully
this will allay criticism from the "why is it flat" developers.

------
johnward
Last time the RC was posted everyone was saying it was a beta and not an RC.
So either it was ready for release or they just released a beta.

------
joekrill
Does Bootstrap now play nice with jQuery UI?

------
buster
Am i the only one who finds that far too many pages look alike thanks to
bootstrap and co?

------
AtTheLast
Nice work bootstrap team! I really like how mobile friendly this version of
bootstrap is!

------
zjgreen
wasn't the easiest upgrade from 2 to 3 on one site of mine...

~~~
alien3d
yup me to.. they changed the css a lot.. have to check one by one.. :(.. But
output outsome. Rc1 ->rc2 -> 3.0.. my menu 3 drill down work again.Rc2 not
work.

------
Sir_Cmpwn
I'm glad they decided to keep glyphicons properly integrated.

------
aerolite
Do you have a list of the differences between RC2 and this?

------
the_cat_kittles
odd bug- i just switched from rc 2 to the official release- now the page
shifts slightly left when modals open, and back when they close. What is going
on?

------
mmgutz
Love the vids!

------
frank_boyd
Awesome!

Thanks to all contributors for the hard work!

------
halisaurus
Well I'm glad I finished a customization of the v2 carousel last night. Will
this thing break if I update? I'm betting yes.

------
pacomerh
On the grids part, basically added what foundation already had

------
manishsharan
"Yo Bootstrap, I'm really happy for you, I'll let you finish, but Foundation
has one of the best frameworks of all time. One of the best frameworks of all
time!" ;-)

~~~
sergiotapia
I found myself backing out of using Foundation after downloading their latest
version and trying to use a couple of their javascript components. Lots of
bugs and generally fugly workarounds needed for the most basic things.

I just removed it, and went back to Bootstrap.

~~~
driverdan
Except Bootstrap 2.x's JS was terribly basic and didn't play well with single
page apps. I haven't tried v3 yet so I don't know if it has improved.

~~~
sergiotapia
I wouldn't know about that; I've never built a single page app.

