Merge branch 'master' into derp

Conflicts:
	Gruntfile.js
	dist/css/bootstrap-theme.css.map
	dist/css/bootstrap.css
	dist/css/bootstrap.css.map
	dist/css/bootstrap.min.css
	dist/fonts/glyphicons-halflings-regular.svg
	docs/_includes/components/badges.html
	docs/_includes/components/input-groups.html
	docs/_includes/components/pagination.html
	docs/_includes/css/forms.html
	docs/_includes/footer.html
	docs/_includes/getting-started/browser-device-support.html
	docs/_includes/getting-started/grunt.html
	docs/_includes/home-nav.html
	docs/_includes/js/alerts.html
	docs/_includes/js/buttons.html
	docs/_includes/js/carousel.html
	docs/_includes/js/collapse.html
	docs/_includes/js/modal.html
	docs/_includes/js/popovers.html
	docs/_includes/js/tooltips.html
	docs/_includes/nav/getting-started.html
	docs/_includes/nav/javascript.html
	docs/assets/css/docs.min.css
	docs/assets/css/src/docs.css
	docs/assets/js/customize.min.js
	docs/assets/js/raw-files.min.js
	docs/browser-bugs.html
	docs/dist/css/bootstrap-theme.css.map
	docs/dist/css/bootstrap.css
	docs/dist/css/bootstrap.css.map
	docs/dist/css/bootstrap.min.css
	docs/dist/fonts/glyphicons-halflings-regular.svg
	fonts/glyphicons-halflings-regular.svg
	less/_button-group.less
	less/_jumbotron.less
	less/_variables.less
	less/mixins/vendor-prefixes.less
	less/panels.less
	less/thumbnails.less
	package.json

.travis.yml

 language: node_js
+git:
+  depth: 10
 node_js:
   - "0.10"
 before_install:
-  - time travis_retry sudo pip install -r test-infra/requirements.txt
+  - travis_retry sudo pip install -r test-infra/requirements.txt
   - rvm use 1.9.3 --fuzzy
   - export GEMDIR=$(rvm gemdir)
   - if [ "$TWBS_TEST" = validate-html ]; then echo "ruby=$(basename $GEMDIR) jekyll=$JEKYLL_VERSION rouge=$ROUGE_VERSION" > pseudo_Gemfile.lock; fi
@@ -10,7 +12,7 @@ before_install:
   - echo "$TRAVIS_COMMIT_MSG" | grep '\[skip validator\]'; export TWBS_DO_VALIDATOR=$?; true
   - echo "$TRAVIS_COMMIT_MSG" | grep '\[skip sauce\]'; export TWBS_DO_SAUCE=$?; true
 install:
-  - time npm install -g grunt-cli
+  - npm install -g grunt-cli
   - ./test-infra/s3_cache.py download npm-modules
   - if [ "$TWBS_TEST" = validate-html ] && [ $TWBS_DO_VALIDATOR -ne 0 ]; then ./test-infra/s3_cache.py download rubygems; fi
 after_script:
@@ -18,8 +20,8 @@ after_script:
   - if [ "$TWBS_TEST" = validate-html ] && [ $TWBS_DO_VALIDATOR -ne 0 ]; then ./test-infra/s3_cache.py upload rubygems; fi
 env:
   global:
-    - JEKYLL_VERSION: 2.1.1
-    - ROUGE_VERSION: 1.6.1
+    - JEKYLL_VERSION: 2.3.0
+    - ROUGE_VERSION: 1.6.2
     - SAUCE_USERNAME: bootstrap
     - secure: "pJkBwnuae9dKU5tEcCqccfS1QQw7/meEcfz63fM7ba7QJNjoA6BaXj08L5Z3Vb5vBmVPwBawxo5Hp0jC0r/Z/O0hGnAmz/Cz09L+cy7dSAZ9x4hvZePSja/UAusaB5ogMoO8l2b773MzgQeSmrLbExr9BWLeqEfjC2hFgdgHLaQ="
     - secure: "gqjqISbxBJK6byFbsmr1AyP1qoWH+rap06A2gI7v72+Tn2PU2nYkIMUkCvhZw6K889jv+LhQ/ybcBxDOXHpNCExCnSgB4dcnmYp+9oeNZb37jSP0rQ+Ib4OTLjzc3/FawE/fUq5kukZTC7porzc/k0qJNLAZRx3YLALmK1GIdUY="

CONTRIBUTING.md

@@ -184,4 +184,3 @@ Run `grunt test` before committing to ensure your changes follow our coding stan
 By contributing your code, you agree to license your contribution under the [MIT license](https://github.com/twbs/bootstrap/blob/master/LICENSE).
 
 Prior to v3.1.0, Bootstrap was released under the Apache License v2.0.
-

Gruntfile.js

@@ -19,6 +19,12 @@ module.exports = function (grunt) {
   var path = require('path');
   var npmShrinkwrap = require('npm-shrinkwrap');
   var BsLessdocParser = require('./grunt/bs-lessdoc-parser.js');
+  var getLessVarsData = function () {
+    var filePath = path.join(__dirname, 'less/_variables.less');
+    var fileContent = fs.readFileSync(filePath, { encoding: 'utf8' });
+    var parser = new BsLessdocParser(fileContent);
+    return { sections: parser.parseFile() };
+  };
   var generateRawFiles = require('./grunt/bs-raw-files-generator.js');
 
   // Project configuration.
@@ -36,7 +42,8 @@ module.exports = function (grunt) {
 
     // Task configuration.
     clean: {
-      dist: ['dist', 'docs/dist']
+      dist: 'dist',
+      docs: 'docs/dist'
     },
 
     jshint: {
@@ -49,7 +56,7 @@ module.exports = function (grunt) {
         },
         src: ['Gruntfile.js', 'grunt/*.js']
       },
-      src: {
+      core: {
         src: 'js/*.js'
       },
       test: {
@@ -70,8 +77,8 @@ module.exports = function (grunt) {
       grunt: {
         src: '<%= jshint.grunt.src %>'
       },
-      src: {
-        src: '<%= jshint.src.src %>'
+      core: {
+        src: '<%= jshint.core.src %>'
       },
       test: {
         src: '<%= jshint.test.src %>'
@@ -112,7 +119,7 @@ module.exports = function (grunt) {
       options: {
         preserveComments: 'some'
       },
-      bootstrap: {
+      core: {
         src: '<%= concat.bootstrap.dest %>',
         dest: 'dist/js/<%= pkg.name %>.min.js'
       },
@@ -155,9 +162,8 @@ module.exports = function (grunt) {
           sourceMapURL: '<%= pkg.name %>.css.map',
           sourceMapFilename: 'dist/css/<%= pkg.name %>.css.map'
         },
-        files: {
-          'dist/css/<%= pkg.name %>.css': 'less/bootstrap.less'
-        }
+        src: 'less/bootstrap.less',
+        dest: 'dist/css/<%= pkg.name %>.css'
       },
       compileDocs: {
         options: {
@@ -199,25 +205,6 @@ module.exports = function (grunt) {
       }
     },
 
-    csslint: {
-      options: {
-        csslintrc: 'less/.csslintrc'
-      },
-      src: [
-        'dist/css/bootstrap.css'
-      ],
-      examples: [
-        'docs/examples/**/*.css'
-      ],
-      docs: {
-        options: {
-          ids: false,
-          'overqualified-elements': false
-        },
-        src: 'docs/assets/css/docs.css'
-      }
-    },
-
     cssmin: {
       options: {
         compatibility: 'ie8',
@@ -262,22 +249,15 @@ module.exports = function (grunt) {
         dest: 'docs/examples/'
       },
       docs: {
-        files: {
-          'docs/assets/css/src/docs.css': 'docs/assets/css/src/docs.css'
-        }
+        src: 'docs/assets/css/src/docs.css',
+        dest: 'docs/assets/css/src/docs.css'
       }
     },
 
     copy: {
       docs: {
-        expand: true,
-        cwd: './dist',
-        src: [
-          'css/*',
-          'js/*',
-          'fonts/*'
-        ],
-        dest: 'docs/dist'
+        src: 'dist/*/*',
+        dest: 'docs/'
       }
     },
 
@@ -295,20 +275,17 @@ module.exports = function (grunt) {
     },
 
     jade: {
-      compile: {
-        options: {
-          pretty: true,
-          data: function () {
-            var filePath = path.join(__dirname, 'less/variables.less');
-            var fileContent = fs.readFileSync(filePath, { encoding: 'utf8' });
-            var parser = new BsLessdocParser(fileContent);
-            return { sections: parser.parseFile() };
-          }
-        },
-        files: {
-          'docs/_includes/customizer-variables.html': 'docs/_jade/customizer-variables.jade',
-          'docs/_includes/customize-nav.html': 'docs/_jade/customizer-nav.jade'
-        }
+      options: {
+        pretty: true,
+        data: getLessVarsData
+      },
+      customizerVars: {
+        src: 'docs/_jade/customizer-variables.jade',
+        dest: 'docs/_includes/customizer-variables.html'
+      },
+      customizerNav: {
+        src: 'docs/_jade/customizer-nav.jade',
+        dest: 'docs/_includes/nav/customize.html'
       }
     },
 
@@ -321,7 +298,11 @@ module.exports = function (grunt) {
         relaxerror: [
           'Bad value X-UA-Compatible for attribute http-equiv on element meta.',
           'Element img is missing required attribute src.',
-          'Attribute autocomplete not allowed on element input at this point.'
+          'Attribute autocomplete not allowed on element input at this point.',
+          'Attribute autocomplete not allowed on element button at this point.',
+          'Element div not allowed as child of element progress in this context.',
+          'Element thead not allowed as child of element table in this context.',
+          'Bad value tablist for attribute role on element nav.'
         ]
       },
       files: {
@@ -331,8 +312,8 @@ module.exports = function (grunt) {
 
     watch: {
       src: {
-        files: '<%= jshint.src.src %>',
-        tasks: ['jshint:src', 'qunit']
+        files: '<%= jshint.core.src %>',
+        tasks: ['jshint:src', 'qunit', 'concat']
       },
       test: {
         files: '<%= jshint.test.src %>',
@@ -397,7 +378,7 @@ module.exports = function (grunt) {
   var testSubtasks = [];
   // Skip core tests if running a different subset of the test suite
   if (runSubset('core')) {
-    testSubtasks = testSubtasks.concat(['dist-css', 'csslint', 'jshint', 'jscs', 'qunit']);
+    testSubtasks = testSubtasks.concat(['dist-css', 'dist-js', 'jshint:core', 'jshint:test', 'jshint:grunt', 'jscs:core', 'jscs:test', 'jscs:grunt', 'qunit', 'docs']);
   }
   // Skip HTML validation if running a different subset of the test suite
   if (runSubset('validate-html') &&
@@ -417,24 +398,17 @@ module.exports = function (grunt) {
   grunt.registerTask('test', testSubtasks);
 
   // JS distribution task.
-  grunt.registerTask('dist-js', ['concat', 'uglify']);
+  grunt.registerTask('dist-js', ['concat', 'uglify:core']);
 
   // CSS distribution task.
-  grunt.registerTask('less-compile', ['less:compileDocs', 'less:compileCore']);
-  grunt.registerTask('dist-css', ['less-compile', 'autoprefixer', 'usebanner', 'csscomb', 'cssmin']);
-
-  // Docs distribution task.
-  grunt.registerTask('dist-docs', 'copy:docs');
+  grunt.registerTask('less-compile', ['less:compileCore']);
+  grunt.registerTask('dist-css', ['less-compile', 'autoprefixer:core', 'usebanner', 'csscomb:dist', 'cssmin:core']);
 
   // Full distribution task.
-  grunt.registerTask('dist', ['clean', 'dist-css', 'dist-js', 'dist-docs']);
-
-  // Custom docs rebuild task.
-  grunt.registerTask('build', ['clean', 'less-compile', 'autoprefixer:core', 'autoprefixer:docs', 'usebanner', 'csscomb:dist', 'cssmin:core', 'cssmin:docs', 'concat', 'uglify:bootstrap', 'dist-docs']);
+  grunt.registerTask('dist', ['clean:dist', 'dist-css', 'dist-js']);
 
   // Default task.
-  // grunt.registerTask('default', ['test', 'dist']);
-  grunt.registerTask('default', ['dist']);
+  grunt.registerTask('default', ['clean:dist', 'test']);
 
   // Version numbering task.
   // grunt change-version-number --oldver=A.B.C --newver=X.Y.Z
@@ -449,6 +423,12 @@ module.exports = function (grunt) {
     generateRawFiles(grunt, banner);
   });
 
+  // Docs task.
+  grunt.registerTask('docs-css', ['autoprefixer:docs', 'autoprefixer:examples', 'csscomb:docs', 'csscomb:examples', 'cssmin:docs']);
+  grunt.registerTask('docs-js', ['uglify:docsJs', 'uglify:customize']);
+  grunt.registerTask('lint-docs-js', ['jshint:assets', 'jscs:assets']);
+  grunt.registerTask('docs', ['docs-css', 'docs-js', 'lint-docs-js', 'clean:docs', 'copy:docs', 'build-customizer']);
+
   // Task for updating the cached npm packages used by the Travis build (which are controlled by test-infra/npm-shrinkwrap.json).
   // This task should be run and the updated file should be committed whenever Bootstrap's dependencies change.
   grunt.registerTask('update-shrinkwrap', ['exec:npmUpdate', '_update-shrinkwrap']);

README.md

 # [Bootstrap](http://getbootstrap.com)
 [![Bower version](https://badge.fury.io/bo/bootstrap.svg)](http://badge.fury.io/bo/bootstrap)
 [![NPM version](https://badge.fury.io/js/bootstrap.svg)](http://badge.fury.io/js/bootstrap)
-[![Build Status](https://secure.travis-ci.org/twbs/bootstrap.svg?branch=master)](http://travis-ci.org/twbs/bootstrap)
+[![Build Status](https://secure.travis-ci.org/twbs/bootstrap.svg?branch=master)](https://travis-ci.org/twbs/bootstrap)
 [![devDependency Status](https://david-dm.org/twbs/bootstrap/dev-status.svg)](https://david-dm.org/twbs/bootstrap#info=devDependencies)
 [![Selenium Test Status](https://saucelabs.com/browser-matrix/bootstrap.svg)](https://saucelabs.com/u/bootstrap)
 
-Bootstrap is a sleek, intuitive, and powerful front-end framework for faster and easier web development, created by [Mark Otto](http://twitter.com/mdo) and [Jacob Thornton](http://twitter.com/fat), and maintained by the [core team](https://github.com/twbs?tab=members) with the massive support and involvement of the community.
+Bootstrap is a sleek, intuitive, and powerful front-end framework for faster and easier web development, created by [Mark Otto](https://twitter.com/mdo) and [Jacob Thornton](https://twitter.com/fat), and maintained by the [core team](https://github.com/twbs?tab=members) with the massive support and involvement of the community.
 
 To get started, check out <http://getbootstrap.com>!
 
 ## Table of contents
 
- - [Quick start](#quick-start)
- - [Bugs and feature requests](#bugs-and-feature-requests)
- - [Documentation](#documentation)
- - [Contributing](#contributing)
- - [Community](#community)
- - [Versioning](#versioning)
- - [Creators](#creators)
- - [Copyright and license](#copyright-and-license)
+- [Quick start](#quick-start)
+- [Bugs and feature requests](#bugs-and-feature-requests)
+- [Documentation](#documentation)
+- [Contributing](#contributing)
+- [Community](#community)
+- [Versioning](#versioning)
+- [Creators](#creators)
+- [Copyright and license](#copyright-and-license)
 
 ## Quick start
 
-Three quick start options are available:
+Four quick start options are available:
 
 - [Download the latest release](https://github.com/twbs/bootstrap/archive/v3.2.0.zip).
 - Clone the repo: `git clone https://github.com/twbs/bootstrap.git`.
 - Install with [Bower](http://bower.io): `bower install bootstrap`.
+- Install with [npm](https://www.npmjs.org): `npm install bootstrap`.
 
 Read the [Getting started page](http://getbootstrap.com/getting-started/) for information on the framework contents, templates and examples, and more.
 
@@ -66,8 +67,8 @@ Bootstrap's documentation, included in this repo in the root directory, is built
 
 ### Running documentation locally
 
-1. If necessary, [install Jekyll](http://jekyllrb.com/docs/installation) (requires v2.1.x).
-  - **Windows users:** Read [this unofficial guide](https://github.com/juthilo/run-jekyll-on-windows/) to get Jekyll up and running without problems.
+1. If necessary, [install Jekyll](http://jekyllrb.com/docs/installation) (requires v2.3.x).
+  - **Windows users:** Read [this unofficial guide](http://jekyll-windows.juthilo.com/) to get Jekyll up and running without problems.
 2. Install the Ruby-based syntax highlighter, [Rouge](https://github.com/jneen/rouge), with `gem install rouge`.
 3. From the root `/bootstrap` directory, run `jekyll serve` in the command line.
 4. Open <http://localhost:9001> in your browser, and voilà.
@@ -86,7 +87,7 @@ Documentation for v2.3.2 has been made available for the time being at <http://g
 
 Please read through our [contributing guidelines](https://github.com/twbs/bootstrap/blob/master/CONTRIBUTING.md). Included are directions for opening issues, coding standards, and notes on development.
 
-Moreover, if your pull request contains JavaScript patches or features, you must include relevant unit tests. All HTML and CSS should conform to the [Code Guide](http://github.com/mdo/code-guide), maintained by [Mark Otto](http://github.com/mdo).
+Moreover, if your pull request contains JavaScript patches or features, you must include relevant unit tests. All HTML and CSS should conform to the [Code Guide](https://github.com/mdo/code-guide), maintained by [Mark Otto](https://github.com/mdo).
 
 Editor preferences are available in the [editor config](https://github.com/twbs/bootstrap/blob/master/.editorconfig) for easy use in common text editors. Read more and download plugins at <http://editorconfig.org>.
 
@@ -96,9 +97,9 @@ Editor preferences are available in the [editor config](https://github.com/twbs/
 
 Keep track of development and community news.
 
-- Follow [@twbootstrap on Twitter](http://twitter.com/twbootstrap).
+- Follow [@twbootstrap on Twitter](https://twitter.com/twbootstrap).
 - Read and subscribe to [The Official Bootstrap Blog](http://blog.getbootstrap.com).
-- Chat with fellow Bootstrappers in IRC. On the `irc.freenode.net` server, in the `##twitter-bootstrap` channel.
+- Chat with fellow Bootstrappers in IRC. On the `irc.freenode.net` server, in the `##bootstrap` channel.
 - Implementation help may be found at Stack Overflow (tagged [`twitter-bootstrap-3`](http://stackoverflow.com/questions/tagged/twitter-bootstrap-3)).
 
 
@@ -113,13 +114,13 @@ For transparency into our release cycle and in striving to maintain backward com
 
 **Mark Otto**
 
-- <http://twitter.com/mdo>
-- <http://github.com/mdo>
+- <https://twitter.com/mdo>
+- <https://github.com/mdo>
 
 **Jacob Thornton**
 
-- <http://twitter.com/fat>
-- <http://github.com/fat>
+- <https://twitter.com/fat>
+- <https://github.com/fat>
 
 
 

dist/css/bootstrap.css

@@ -205,8 +205,8 @@ th {
   abbr[title]:after {
     content: " (" attr(title) ")";
   }
-  a[href^="javascript:"]:after,
-  a[href^="#"]:after {
+  a[href^="#"]:after,
+  a[href^="javascript:"]:after {
     content: "";
   }
   pre,
@@ -241,10 +241,6 @@ th {
   .navbar {
     display: none;
   }
-  .table td,
-  .table th {
-    background-color: #fff !important;
-  }
   .btn > .caret,
   .dropup > .btn > .caret {
     border-top-color: #000 !important;
@@ -255,6 +251,10 @@ th {
   .table {
     border-collapse: collapse !important;
   }
+  .table td,
+  .table th {
+    background-color: #fff !important;
+  }
   .table-bordered th,
   .table-bordered td {
     border: 1px solid #ddd !important;
@@ -2933,8 +2933,8 @@ tbody.collapse.in {
 [data-toggle="buttons"] > .btn input[type="checkbox"],
 [data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
   position: absolute;
-  z-index: -1;
-  opacity: 0;
+  clip: rect(0, 0, 0, 0);
+  pointer-events: none;
 }
 .input-group {
   position: relative;
@@ -3500,6 +3500,9 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   .navbar-form .form-group {
     margin-bottom: 5px;
   }
+  .navbar-form .form-group:last-child {
+    margin-bottom: 0;
+  }
 }
 @media (min-width: 48em) {
   .navbar-form {
@@ -3659,7 +3662,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
 }
 .navbar-inverse .navbar-brand > a,
 .navbar-inverse .nav-pills > .nav-item > .nav-link {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-brand > a:hover,
 .navbar-inverse .nav-pills > .nav-item > .nav-link:hover,
@@ -3678,7 +3681,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   background-color: #1f2021;
 }
 .navbar-inverse .navbar-brand {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-brand:hover,
 .navbar-inverse .navbar-brand:focus {
@@ -3689,7 +3692,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   color: #a2a8ae;
 }
 .navbar-inverse .navbar-nav > li > a {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-nav > li > a:hover,
 .navbar-inverse .navbar-nav > li > a:focus {
@@ -3736,7 +3739,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
     background-color: #1f2021;
   }
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
-    color: #818a91;
+    color: #aab0b5;
   }
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
@@ -3757,13 +3760,13 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   }
 }
 .navbar-inverse .navbar-link {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-link:hover {
   color: #fff;
 }
 .navbar-inverse .btn-link {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .btn-link:hover,
 .navbar-inverse .btn-link:focus {
@@ -4164,7 +4167,7 @@ a.list-group-item.active > .badge,
   margin-left: 3px;
 }
 .jumbotron {
-  padding: 2rem;
+  padding: 2rem 1rem;
   margin-bottom: 2rem;
   color: inherit;
   background-color: #eceeef;
@@ -4176,7 +4179,8 @@ a.list-group-item.active > .badge,
 .jumbotron > hr {
   border-top-color: #d0d5d8;
 }
-.container .jumbotron {
+.container .jumbotron,
+.container-fluid .jumbotron {
   border-radius: .3rem;
 }
 .jumbotron .container {
@@ -4184,8 +4188,7 @@ a.list-group-item.active > .badge,
 }
 @media screen and (min-width: 48em) {
   .jumbotron {
-    padding-top: 3.2rem;
-    padding-bottom: 3.2rem;
+    padding: 3.2rem 0;
   }
   .container .jumbotron {
     padding-right: 4rem;
@@ -4934,6 +4937,9 @@ button.close {
   display: none;
   max-width: 276px;
   padding: 1px;
+  font-size: 1rem;
+  font-weight: normal;
+  line-height: 1.5;
   text-align: left;
   white-space: normal;
   background-color: #fff;
@@ -4960,8 +4966,6 @@ button.close {
   padding: 8px 14px;
   margin: 0;
   font-size: 1rem;
-  font-weight: normal;
-  line-height: 18px;
   background-color: #f7f7f7;
   border-bottom: 1px solid #ebebeb;
   border-radius: -.7rem -.7rem 0 0;

dist/js/bootstrap.js

@@ -104,7 +104,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     if (e) e.preventDefault()
 
     if (!$parent.length) {
-      $parent = $this.hasClass('alert') ? $this : $this.parent()
+      $parent = $this.closest('.alert')
     }
 
     $parent.trigger(e = $.Event('close.bs.alert'))
@@ -553,7 +553,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     this.$element.trigger(startEvent)
     if (startEvent.isDefaultPrevented()) return
 
-    var actives = this.$parent && this.$parent.find('> .panel > .in')
+    var actives = this.$parent && this.$parent.find('> .panel').children('.in, .collapsing')
 
     if (actives && actives.length) {
       var hasData = actives.data('bs.collapse')
@@ -567,6 +567,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     this.$element
       .removeClass('collapse')
       .addClass('collapsing')[dimension](0)
+      .attr('aria-expanded', true)
 
     this.transitioning = 1
 
@@ -602,15 +603,16 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     this.$element
       .addClass('collapsing')
       .removeClass('collapse in')
+      .attr('aria-expanded', false)
 
     this.transitioning = 1
 
     var complete = function () {
       this.transitioning = 0
       this.$element
-        .trigger('hidden.bs.collapse')
         .removeClass('collapsing')
         .addClass('collapse')
+        .trigger('hidden.bs.collapse')
     }
 
     if (!$.support.transition) return complete.call(this)
@@ -635,7 +637,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
       var data    = $this.data('bs.collapse')
       var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)
 
-      if (!data && options.toggle && option == 'show') option = !option
+      if (!data && options.toggle && option == 'show') options.toggle = false
       if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))
       if (typeof option == 'string') data[option]()
     })
@@ -672,8 +674,9 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var $parent = parent && $(parent)
 
     if (!data || !data.transitioning) {
-      if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed')
-      $this.toggleClass('collapsed', $target.hasClass('in'))
+      if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed').attr('aria-expanded', false)
+      var isCollapsed = $target.hasClass('in')
+      $this.toggleClass('collapsed', isCollapsed).attr('aria-expanded', !isCollapsed)
     }
 
     Plugin.call($target, option)
@@ -1012,7 +1015,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
       this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
         .appendTo(this.$body)
 
-      this.$element.on('mousedown.dismiss.bs.modal', $.proxy(function (e) {
+      this.$element.on('click.dismiss.bs.modal', $.proxy(function (e) {
         if (e.target !== e.currentTarget) return
         this.options.backdrop == 'static'
           ? this.$element[0].focus.call(this.$element[0])
@@ -1050,8 +1053,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
   }
 
   Modal.prototype.checkScrollbar = function () {
-    if (document.body.clientWidth >= window.innerWidth) return
-    this.scrollbarWidth = this.scrollbarWidth || this.measureScrollbar()
+    this.scrollbarWidth = this.measureScrollbar()
   }
 
   Modal.prototype.setScrollbar = function () {
@@ -1064,6 +1066,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
   }
 
   Modal.prototype.measureScrollbar = function () { // thx walsh
+    if (document.body.clientWidth >= window.innerWidth) return 0
     var scrollDiv = document.createElement('div')
     scrollDiv.className = 'modal-scrollbar-measure'
     this.$body.append(scrollDiv)
@@ -1232,6 +1235,11 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var self = obj instanceof this.constructor ?
       obj : $(obj.currentTarget).data('bs.' + this.type)
 
+    if (self && self.$tip && self.$tip.is(':visible')) {
+      self.hoverState = 'in'
+      return
+    }
+
     if (!self) {
       self = new this.constructor(obj.currentTarget, this.getDelegateOptions())
       $(obj.currentTarget).data('bs.' + this.type, self)
@@ -1274,7 +1282,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     if (this.hasContent() && this.enabled) {
       this.$element.trigger(e)
 
-      var inDom = $.contains(document.documentElement, this.$element[0])
+      var inDom = $.contains(this.$element[0].ownerDocument.documentElement, this.$element[0])
       if (e.isDefaultPrevented() || !inDom) return
       var that = this
 
@@ -1383,16 +1391,18 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     if (delta.left) offset.left += delta.left
     else offset.top += delta.top
 
-    var arrowDelta          = delta.left ? delta.left * 2 - width + actualWidth : delta.top * 2 - height + actualHeight
-    var arrowPosition       = delta.left ? 'left'        : 'top'
-    var arrowOffsetPosition = delta.left ? 'offsetWidth' : 'offsetHeight'
+    var isVertical          = /top|bottom/.test(placement)
+    var arrowDelta          = isVertical ? delta.left * 2 - width + actualWidth : delta.top * 2 - height + actualHeight
+    var arrowOffsetPosition = isVertical ? 'offsetWidth' : 'offsetHeight'
 
     $tip.offset(offset)
-    this.replaceArrow(arrowDelta, $tip[0][arrowOffsetPosition], arrowPosition)
+    this.replaceArrow(arrowDelta, $tip[0][arrowOffsetPosition], isVertical)
   }
 
-  Tooltip.prototype.replaceArrow = function (delta, dimension, position) {
-    this.arrow().css(position, delta ? (50 * (1 - delta / dimension) + '%') : '')
+  Tooltip.prototype.replaceArrow = function (delta, dimension, isHorizontal) {
+    this.arrow()
+      .css(isHorizontal ? 'left' : 'top', 50 * (1 - delta / dimension) + '%')
+      .css(isHorizontal ? 'top' : 'left', '')
   }
 
   Tooltip.prototype.setContent = function () {
@@ -1403,16 +1413,17 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     $tip.removeClass('fade in top bottom left right')
   }
 
-  Tooltip.prototype.hide = function () {
+  Tooltip.prototype.hide = function (callback) {
     var that = this
     var $tip = this.tip()
     var e    = $.Event('hide.bs.' + this.type)
 
-    this.$element.removeAttr('aria-describedby')
-
     function complete() {
       if (that.hoverState != 'in') $tip.detach()
-      that.$element.trigger('hidden.bs.' + that.type)
+      that.$element
+        .removeAttr('aria-describedby')
+        .trigger('hidden.bs.' + that.type)
+      callback && callback()
     }
 
     this.$element.trigger(e)
@@ -1450,7 +1461,11 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var isBody = el.tagName == 'BODY'
     var isSvg  = window.SVGElement && el instanceof window.SVGElement
 
-    var elRect    = el.getBoundingClientRect ? el.getBoundingClientRect() : null
+    var elRect    = el.getBoundingClientRect()
+    if (elRect.width == null) {
+      // width and height are missing in IE8, so compute them manually; see https://github.com/twbs/bootstrap/issues/14093
+      elRect = $.extend({}, elRect, { width: elRect.right - elRect.left, height: elRect.bottom - elRect.top })
+    }
     var elOffset  = isBody ? { top: 0, left: 0 } : $element.offset()
     var scroll    = { scroll: isBody ? document.documentElement.scrollTop || document.body.scrollTop : $element.scrollTop() }
     var outerDims = isSvg ? {} : {
@@ -1522,14 +1537,6 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     return (this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow'))
   }
 
-  Tooltip.prototype.validate = function () {
-    if (!this.$element[0].parentNode) {
-      this.hide()
-      this.$element = null
-      this.options  = null
-    }
-  }
-
   Tooltip.prototype.enable = function () {
     this.enabled = true
   }
@@ -1556,8 +1563,11 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
   }
 
   Tooltip.prototype.destroy = function () {
+    var that = this
     clearTimeout(this.timeout)
-    this.hide().$element.off('.' + this.type).removeData('bs.' + this.type)
+    this.hide(function () {
+      that.$element.off('.' + that.type).removeData('bs.' + that.type)
+    })
   }
 
 
@@ -1640,7 +1650,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var content = this.getContent()
 
     $tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)
-    $tip.find('.popover-content').empty()[ // we use append for html objects to maintain js events
+    $tip.find('.popover-content').children().detach().end()[ // we use append for html objects to maintain js events
       this.options.html ? (typeof content == 'string' ? 'html' : 'append') : 'text'
     ](content)
 
@@ -1773,6 +1783,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
         return ($href
           && $href.length
           && $href.is(':visible')
+          && $el.is(':visible')
           && [[$href[offsetMethod]().top + offsetBase, href]]) || null
       })
       .sort(function (a, b) { return a[0] - b[0] })
@@ -2162,8 +2173,8 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
 
       data.offset = data.offset || {}
 
-      if (data.offsetBottom) data.offset.bottom = data.offsetBottom
-      if (data.offsetTop)    data.offset.top    = data.offsetTop
+      if (data.offsetBottom != null) data.offset.bottom = data.offsetBottom
+      if (data.offsetTop    != null) data.offset.top    = data.offsetTop
 
       Plugin.call($spy, data)
     })

docs/_data/core-team.yml

@@ -17,3 +17,7 @@
 - name: XhmikosR
   user: xhmikosr
   gravatar: e37759b1ea0125d4e97b1e00b5eed26f
+
+- name: Heinrich Fenkart
+  user: hnrch02
+  gravatar: 0d53f5d3d3d28bd470f394d98f7ef48f

docs/_data/translations.yml

@@ -35,5 +35,5 @@
 
 - name: Ukrainian
   code: uk
-  description: Bootstrap ua Українською
-  url: http://twbs.site-konstruktor.com.ua
+  description: Bootstrap українською
+  url: http://twbs.docs.org.ua

docs/_includes/customizer-variables.html

@@ -87,6 +87,18 @@
     <label for="input-@enable-gradients">@enable-gradients</label>
     <input id="input-@enable-gradients" type="text" value="true" data-var="@enable-gradients" class="form-control"/>
   </div>
+  <div class="bs-customizer-input">
+    <label for="input-@enable-transitions">@enable-transitions</label>
+    <input id="input-@enable-transitions" type="text" value="true" data-var="@enable-transitions" class="form-control"/>
+  </div>
+  <div class="bs-customizer-input">
+    <label for="input-@spacer">@spacer</label>
+    <input id="input-@spacer" type="text" value="1rem" data-var="@spacer" class="form-control"/>
+  </div>
+  <div class="bs-customizer-input">
+    <label for="input-@border-width">@border-width</label>
+    <input id="input-@border-width" type="text" value=".05rem" data-var="@border-width" class="form-control"/>
+  </div>
 </div>
 <h2 id="typography">Typography</h2>
 <p>Font, line-height, and color for body text, headings, and more.</p>
@@ -191,7 +203,7 @@
   </div>
   <div class="bs-customizer-input">
     <label for="input-@padding-base-horizontal">@padding-base-horizontal</label>
-    <input id="input-@padding-base-horizontal" type="text" value="1rem" data-var="@padding-base-horizontal" class="form-control"/>
+    <input id="input-@padding-base-horizontal" type="text" value=".75rem" data-var="@padding-base-horizontal" class="form-control"/>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@padding-large-vertical">@padding-large-vertical</label>
@@ -227,7 +239,7 @@
   </div>
   <div class="bs-customizer-input">
     <label for="input-@border-radius-base">@border-radius-base</label>
-    <input id="input-@border-radius-base" type="text" value=".2rem" data-var="@border-radius-base" class="form-control"/>
+    <input id="input-@border-radius-base" type="text" value=".25rem" data-var="@border-radius-base" class="form-control"/>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@border-radius-large">@border-radius-large</label>
@@ -263,7 +275,7 @@
 <div class="row">
   <div class="bs-customizer-input">
     <label for="input-@table-cell-padding">@table-cell-padding</label>
-    <input id="input-@table-cell-padding" type="text" value=".6rem" data-var="@table-cell-padding" class="form-control"/>
+    <input id="input-@table-cell-padding" type="text" value=".75rem" data-var="@table-cell-padding" class="form-control"/>
     <p class="help-block">Padding for <code>&lt;th&gt;</code>s and <code>&lt;td&gt;</code>s.</p>
   </div>
   <div class="bs-customizer-input">
@@ -292,7 +304,7 @@
   </div>
   <div class="bs-customizer-input">
     <label for="input-@table-border-color">@table-border-color</label>
-    <input id="input-@table-border-color" type="text" value="#ddd" data-var="@table-border-color" class="form-control"/>
+    <input id="input-@table-border-color" type="text" value="@gray-lighter" data-var="@table-border-color" class="form-control"/>
     <p class="help-block">Border color for table and cell borders.</p>
   </div>
 </div>
@@ -406,7 +418,17 @@
   <div class="bs-customizer-input">
     <label for="input-@input-border-radius">@input-border-radius</label>
     <input id="input-@input-border-radius" type="text" value="@border-radius-base" data-var="@input-border-radius" class="form-control"/>
-    <p class="help-block"><code>&lt;input&gt;</code> border radius</p>
+    <p class="help-block">Default <code>.form-control</code> border radius</p>
+  </div>
+  <div class="bs-customizer-input">
+    <label for="input-@input-border-radius-large">@input-border-radius-large</label>
+    <input id="input-@input-border-radius-large" type="text" value="@border-radius-large" data-var="@input-border-radius-large" class="form-control"/>
+    <p class="help-block">Large <code>.form-control</code> border radius</p>
+  </div>
+  <div class="bs-customizer-input">
+    <label for="input-@input-border-radius-small">@input-border-radius-small</label>
+    <input id="input-@input-border-radius-small" type="text" value="@border-radius-small" data-var="@input-border-radius-small" class="form-control"/>
+    <p class="help-block">Small <code>.form-control</code> border radius</p>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@input-border-focus">@input-border-focus</label>
@@ -424,17 +446,17 @@
   </div>
   <div class="bs-customizer-input">
     <label for="input-@input-height-base">@input-height-base</label>
-    <input id="input-@input-height-base" type="text" value="((@font-size-base * @line-height-base) + (@padding-base-vertical * 2) + .2)" data-var="@input-height-base" class="form-control"/>
+    <input id="input-@input-height-base" type="text" value="((@font-size-base * @line-height-base) + (@padding-base-vertical * 2) + (@border-width * 2))" data-var="@input-height-base" class="form-control"/>
     <p class="help-block">Default <code>.form-control</code> height</p>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@input-height-large">@input-height-large</label>
-    <input id="input-@input-height-large" type="text" value="((@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + .2)" data-var="@input-height-large" class="form-control"/>
+    <input id="input-@input-height-large" type="text" value="((@font-size-large * @line-height-large) + (@padding-large-vertical * 2) + (@border-width * 2))" data-var="@input-height-large" class="form-control"/>
     <p class="help-block">Large <code>.form-control</code> height</p>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@input-height-small">@input-height-small</label>
-    <input id="input-@input-height-small" type="text" value="((@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + .2)" data-var="@input-height-small" class="form-control"/>
+    <input id="input-@input-height-small" type="text" value="((@font-size-small * @line-height-small) + (@padding-small-vertical * 2) + (@border-width * 2))" data-var="@input-height-small" class="form-control"/>
     <p class="help-block">Small <code>.form-control</code> height</p>
   </div>
   <div class="bs-customizer-input">
@@ -678,7 +700,7 @@
   </div>
   <div class="bs-customizer-input">
     <label for="input-@navbar-inverse-bg">@navbar-inverse-bg</label>
-    <input id="input-@navbar-inverse-bg" type="text" value="#222" data-var="@navbar-inverse-bg" class="form-control"/>
+    <input id="input-@navbar-inverse-bg" type="text" value="#373a3c" data-var="@navbar-inverse-bg" class="form-control"/>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@navbar-inverse-border">@navbar-inverse-border</label>
@@ -686,7 +708,7 @@
   </div>
   <div class="bs-customizer-input">
     <label for="input-@navbar-inverse-link-color">@navbar-inverse-link-color</label>
-    <input id="input-@navbar-inverse-link-color" type="text" value="@gray-light" data-var="@navbar-inverse-link-color" class="form-control"/>
+    <input id="input-@navbar-inverse-link-color" type="text" value="lighten(@gray-light, 15%)" data-var="@navbar-inverse-link-color" class="form-control"/>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@navbar-inverse-link-hover-color">@navbar-inverse-link-hover-color</label>
@@ -743,7 +765,7 @@
 <div class="row">
   <div class="bs-customizer-input">
     <label for="input-@nav-link-padding">@nav-link-padding</label>
-    <input id="input-@nav-link-padding" type="text" value=".5em 1em" data-var="@nav-link-padding" class="form-control"/>
+    <input id="input-@nav-link-padding" type="text" value=".6em 1em" data-var="@nav-link-padding" class="form-control"/>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@nav-link-hover-bg">@nav-link-hover-bg</label>
@@ -757,10 +779,6 @@
     <label for="input-@nav-disabled-link-hover-color">@nav-disabled-link-hover-color</label>
     <input id="input-@nav-disabled-link-hover-color" type="text" value="@gray-light" data-var="@nav-disabled-link-hover-color" class="form-control"/>
   </div>
-  <div class="bs-customizer-input">
-    <label for="input-@nav-open-link-hover-color">@nav-open-link-hover-color</label>
-    <input id="input-@nav-open-link-hover-color" type="text" value="#fff" data-var="@nav-open-link-hover-color" class="form-control"/>
-  </div>
 </div>
 <h2 id="tabs">Tabs</h2>
 <div class="row">
@@ -897,7 +915,7 @@
 <div class="row">
   <div class="bs-customizer-input">
     <label for="input-@jumbotron-padding">@jumbotron-padding</label>
-    <input id="input-@jumbotron-padding" type="text" value="30px" data-var="@jumbotron-padding" class="form-control"/>
+    <input id="input-@jumbotron-padding" type="text" value="2rem" data-var="@jumbotron-padding" class="form-control"/>
   </div>
   <div class="bs-customizer-input">
     <label for="input-@jumbotron-color">@jumbotron-color</label>
@@ -911,10 +929,6 @@
     <label for="input-@jumbotron-heading-color">@jumbotron-heading-color</label>
     <input id="input-@jumbotron-heading-color" type="text" value="inherit" data-var="@jumbotron-heading-color" class="form-control"/>
   </div>
-  <div class="bs-customizer-input">
-    <label for="input-@jumbotron-font-size">@jumbotron-font-size</label>
-    <input id="input-@jumbotron-font-size" type="text" value="ceil((@font-size-base * 1.5))" data-var="@jumbotron-font-size" class="form-control"/>
-  </div>
 </div>
 <h2 id="form-states-and-alerts">Form states and alerts</h2>
 <p>Define colors for form feedback states and, by default, alerts.</p>
@@ -1036,7 +1050,7 @@
   </div>
   <div class="bs-customizer-input">
     <label for="input-@popover-arrow-color">@popover-arrow-color</label>
-    <input id="input-@popover-arrow-color" type="text" value="#fff" data-var="@popover-arrow-color" class="form-control"/>
+    <input id="input-@popover-arrow-color" type="text" value="@popover-bg" data-var="@popover-arrow-color" class="form-control"/>
     <p class="help-block">Popover arrow color</p>
   </div>
   <div class="bs-customizer-input">

docs/_includes/footer.html

@@ -4,7 +4,9 @@
   <div class="bs-docs-container">
     {% include social-buttons.html %}
 
-    <p>Designed and built with all the love in the world by <a href="http://twitter.com/mdo" target="_blank">@mdo</a> and <a href="http://twitter.com/fat" target="_blank">@fat</a>. Maintained by the <a href="https://github.com/twbs?tab=members">core team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>. Code licensed under <a href="https://github.com/twbs/bootstrap/blob/master/LICENSE" target="_blank">MIT</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
+    <p>Designed and built with all the love in the world by <a href="https://twitter.com/mdo" target="_blank">@mdo</a> and <a href="https://twitter.com/fat" target="_blank">@fat</a>.</p>
+    <p>Maintained by the <a href="https://github.com/orgs/twbs/people">core team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>.</p>
+    <p>Code licensed under <a href="https://github.com/twbs/bootstrap/blob/master/LICENSE" target="_blank">MIT</a>, documentation under <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.</p>
     <ul class="bs-docs-footer-links muted">
       <li>Currently v{{ site.current_version }}</li>
       <li>&middot;</li>
@@ -20,7 +22,7 @@
       <li>&middot;</li>
       <li><a href="{{ site.blog }}">Blog</a></li>
       <li>&middot;</li>
-      <li><a href="{{ site.repo }}/issues?state=open">Issues</a></li>
+      <li><a href="{{ site.repo }}/issues">Issues</a></li>
       <li>&middot;</li>
       <li><a href="{{ site.repo }}/releases">Releases</a></li>
     </ul>

docs/_includes/nav/customize.html

+
+<!-- NOTE: DO NOT EDIT THE FOLLOWING SECTION DIRECTLY! It is autogenerated via the `build-customizer-html` Grunt task using the customizer-nav.jade template.-->
+<li><a href="#import">Import</a></li>
+<li><a href="#less">Less components</a></li>
+<li><a href="#plugins">jQuery plugins</a></li>
+<li><a href="#less-variables">Less variables</a>
+  <ul class="nav">
+    <li><a href="#colors">Colors</a></li>
+    <li><a href="#scaffolding">Scaffolding</a></li>
+    <li><a href="#global-settings">Global settings</a></li>
+    <li><a href="#typography">Typography</a></li>
+    <li><a href="#components">Components</a></li>
+    <li><a href="#tables">Tables</a></li>
+    <li><a href="#buttons">Buttons</a></li>
+    <li><a href="#forms">Forms</a></li>
+    <li><a href="#dropdowns">Dropdowns</a></li>
+    <li><a href="#media-queries-breakpoints">Media queries breakpoints</a></li>
+    <li><a href="#grid-system">Grid system</a></li>
+    <li><a href="#container-sizes">Container sizes</a></li>
+    <li><a href="#navbar">Navbar</a></li>
+    <li><a href="#navs">Navs</a></li>
+    <li><a href="#tabs">Tabs</a></li>
+    <li><a href="#pills">Pills</a></li>
+    <li><a href="#pagination">Pagination</a></li>
+    <li><a href="#pager">Pager</a></li>
+    <li><a href="#jumbotron">Jumbotron</a></li>
+    <li><a href="#form-states-and-alerts">Form states and alerts</a></li>
+    <li><a href="#tooltips">Tooltips</a></li>
+    <li><a href="#popovers">Popovers</a></li>
+    <li><a href="#labels">Labels</a></li>
+    <li><a href="#modals">Modals</a></li>
+    <li><a href="#alerts">Alerts</a></li>
+    <li><a href="#progress-bars">Progress bars</a></li>
+    <li><a href="#list-group">List group</a></li>
+    <li><a href="#thumbnails">Thumbnails</a></li>
+    <li><a href="#badges">Badges</a></li>
+    <li><a href="#breadcrumbs">Breadcrumbs</a></li>
+    <li><a href="#carousel">Carousel</a></li>
+    <li><a href="#close">Close</a></li>
+    <li><a href="#code">Code</a></li>
+    <li><a href="#type">Type</a></li>
+  </ul>
+</li>
+<li><a href="#download">Download</a></li>
+<!-- NOTE: DO NOT EDIT THE PRECEDING SECTION DIRECTLY! It is autogenerated via the `build-customizer-html` Grunt task using the customizer-nav.jade template.-->
\ No newline at end of file

docs/assets/js/src/customizer.js

@@ -73,6 +73,7 @@ window.onload = function () { // wait for load in a dumb way because B-0
     $.ajax({
       url: 'https://api.github.com/gists',
       type: 'POST',
+      contentType: 'application/json; charset=UTF-8',
       dataType: 'json',
       data: JSON.stringify(data)
     })

docs/assets/less/docs.less

@@ -1073,6 +1073,14 @@ body {
   margin: 1.25rem;
 }
 
+// Tooltips
+.bs-example-tooltip .tooltip {
+  position: relative;
+  display: inline-block;
+  margin: 10px 20px;
+  opacity: 1;
+}
+
 // Scrollspy demo on fixed height div
 .scrollspy-example {
   position: relative;
@@ -1269,6 +1277,35 @@ body {
           box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
 }
 
+// Drag and drop
+.bs-dropzone {
+  position: relative;
+  padding: 20px;
+  margin-bottom: 20px;
+  color: #777;
+  text-align: center;
+  border: 2px dashed #eee;
+  border-radius: 4px;
+}
+.bs-dropzone h2 {
+  margin-top: 0;
+  margin-bottom: 5px;
+}
+.bs-dropzone .lead {
+  margin-bottom: 10px;
+  font-weight: normal;
+  color: #333;
+}
+.bs-dropzone hr {
+  width: 100px;
+}
+#import-manual-trigger {
+  cursor: pointer;
+}
+.bs-dropzone p:last-child {
+  margin-bottom: 0;
+}
+
 
 //
 // Brand guidelines

docs/browser-bugs.md

@@ -18,6 +18,12 @@ We publicly list browser bugs that are impacting us here, in the hopes of expedi
       </tr>
     </thead>
     <tbody>
+      <tr>
+        <td>Internet Explorer 11</td>
+        <td>When hovering over a <code>&lt;select&gt;</code> menu item, the cursor for the element underneath the menu is displayed</td>
+        <td><a href="https://connect.microsoft.com/IE/feedbackdetail/view/963961">IE bug #963961</a></td>
+        <td><a href="https://github.com/twbs/bootstrap/issues/14528">#14528</a></td>
+      </tr>
       <tr>
         <td>Firefox</td>
         <td><code>.table-bordered</code> with an empty <code>&lt;tbody&gt;</code> is missing borders</td>
@@ -42,6 +48,18 @@ We publicly list browser bugs that are impacting us here, in the hopes of expedi
         <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1048279">Mozilla bug #1048279</a></td>
         <td><a href="https://github.com/twbs/bootstrap/issues/14124">#14124</a></td>
       </tr>
+      <tr>
+        <td>Firefox</td>
+        <td>If the disabled state of a form control is changed via JavaScript, the normal state doesn't return after refreshing the page.</td>
+        <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=654072">Mozilla bug #654072</a></td>
+        <td><a href="https://github.com/twbs/bootstrap/issues/793">#793</a></td>
+      </tr>
+      <tr>
+        <td>Firefox</td>
+        <td>Button elements with <code>width: 100%</code> become cropped in long tables.</td>
+        <td><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1060131">Mozilla bug #1060131</a></td>
+        <td><a href="https://github.com/twbs/bootstrap/issues/14320">#14320</a></td>
+      </tr>
       <tr>
         <td>Chrome</td>
         <td>Weird button behavior with some number <code>&lt;input&gt;</code>s</td>

docs/components/badges.md

@@ -29,23 +29,6 @@ Built-in styles are included for placing badges in active states in pill navigat
     <a class="nav-link" href="#">Messages <span class="badge">3</span></a>
   </li>
 </ul>
-<ul class="nav nav-pills nav-stacked" role="tablist" style="max-width: 260px;">
-  <li class="nav-item active" role="presentation">
-    <a class="nav-link" href="#">
-      <span class="badge pull-right">42</span>
-      Home
-    </a>
-  </li>
-  <li class="nav-item" role="presentation">
-    <a class="nav-link" href="#">Profile</a>
-  </li>
-  <li class="nav-item" role="presentation">
-    <a class="nav-link" href="#">
-      <span class="badge pull-right">3</span>
-      Messages
-    </a>
-  </li>
-</ul>
 {% endexample %}
 
 ### Buttons

docs/components/dropdowns.md

@@ -86,7 +86,7 @@ Separate groups of related menu items with a divider.
 Add `.disabled` to a `<li>` in the dropdown to disable the link.
 
 {% example html %}
-<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu3">
+<ul class="dropdown-menu" role="menu">
   <li role="presentation">
     <a role="menuitem" tabindex="-1" href="#">Regular link</a>
   </li>

docs/components/forms.md

@@ -316,12 +316,12 @@ Add the `disabled` attribute to a `<fieldset>` to disable all the controls withi
 
 <div class="bs-callout bs-callout-warning">
   <h4>Caveat about link functionality of `&lt;a&gt;`</h4>
-  <p>Our styles use `pointer-events: none` to try to disable the link functionality of `&lt;a class="btn btn-*"&gt;` buttons in this case, but that CSS property is not yet standardized and isn't fully supported in Opera 18 and below, or in Internet Explorer 11. So to be safe, use custom JavaScript to disable such links.</p>
+  <p>Our styles use `pointer-events: none` to try to disable the link functionality of <code>&lt;a class="btn btn-*"&gt;</code> buttons in this case, but that CSS property is not yet standardized and isn't fully supported in Opera 18 and below, or in Internet Explorer 11. So to be safe, use custom JavaScript to disable such links.</p>
 </div>
 
 <div class="bs-callout bs-callout-danger">
   <h4>Cross-browser compatibility</h4>
-  <p>While Bootstrap will apply these styles in all browsers, Internet Explorer 9 and below don't actually support the `disabled` attribute on a `&lt;fieldset&gt;`. Use custom JavaScript to disable the fieldset in these browsers.</p>
+  <p>While Bootstrap will apply these styles in all browsers, Internet Explorer 11 and below don't fully support the <code>disabled</code> attribute on a <code>&lt;fieldset&gt;</code>. Use custom JavaScript to disable the fieldset in these browsers.</p>
 </div>
 
 ## Readonly inputs
@@ -441,9 +441,9 @@ Set heights using classes like `.input-lg`, and set widths using grid column cla
 <input class="form-control" type="text" placeholder="Default input">
 <input class="form-control input-sm" type="text" placeholder=".input-sm">
 
-<select class="form-control input-lg">...</select>
-<select class="form-control">...</select>
-<select class="form-control input-sm">...</select>
+<select class="form-control input-lg"></select>
+<select class="form-control"></select>
+<select class="form-control input-sm"></select>
 {% endexample %}
 
 Quickly size labels and form controls within `.form-horizontal` by adding `.form-group-lg` or `.form-group-sm` to existing `.form-group`s.

docs/components/input-group.md

@@ -3,11 +3,11 @@ layout: page
 title: Input group
 ---
 
-Extend form controls by adding text or buttons before, after, or on both sides of any text-based input. Use `.input-group` with an `.input-group-addon` to prepend or append elements to a single `.form-control`.
+Extend form controls by adding text or buttons before, after, or on both sides of any text-based `<input>`. Use `.input-group` with an `.input-group-addon` to prepend or append elements to a single `.form-control`.
 
 <div class="bs-callout bs-callout-danger">
-  <h4>Cross-browser compatibility</h4>
-  <p>Avoid using <code>&lt;select&gt;</code> elements here as they cannot be fully styled in WebKit browsers.</p>
+  <h4>Textual <code>&lt;input&gt;</code>s only</h4>
+  <p>Avoid using <code>&lt;textarea&gt;</code> elements here as their <code>rows</code> attribute will not be respected in some cases.</p>
 </div>
 <div class="bs-callout bs-callout-warning">
   <h4>Tooltips &amp; popovers in input groups require special setting</h4>

docs/components/new-navbar.md

@@ -77,7 +77,7 @@ Proposal to replace the existing navbar with something simpler and more customiz
       <a class="nav-link" href="#">About</a>
     </li>
   </ul>
-  <form action="" class="form-inline pull-right">
+  <form class="form-inline pull-right">
     <input class="form-control" type="text" placeholder="Search">
     <button class="btn btn-primary" type="submit">Search</button>
   </form>
@@ -101,7 +101,7 @@ Proposal to replace the existing navbar with something simpler and more customiz
       <a class="nav-link" href="#">About</a>
     </li>
   </ul>
-  <form action="" class="form-inline pull-right">
+  <form class="form-inline pull-right">
     <input class="form-control" type="text" placeholder="Search">
     <button class="btn btn-primary" type="submit">Search</button>
   </form>

docs/components/pagination.md

@@ -10,15 +10,17 @@ Provide pagination links for your site or app with the multi-page pagination com
 Simple pagination inspired by Rdio, great for apps and search results. The large block is hard to miss, easily scalable, and provides large click areas.
 
 {% example html %}
-<ul class="pagination">
-  <li><a href="#">&laquo;</a></li>
-  <li><a href="#">1</a></li>
-  <li><a href="#">2</a></li>
-  <li><a href="#">3</a></li>
-  <li><a href="#">4</a></li>
-  <li><a href="#">5</a></li>
-  <li><a href="#">&raquo;</a></li>
-</ul>
+<nav>
+  <ul class="pagination">
+    <li><a href="#">&laquo;</a></li>
+    <li><a href="#">1</a></li>
+    <li><a href="#">2</a></li>
+    <li><a href="#">3</a></li>
+    <li><a href="#">4</a></li>
+    <li><a href="#">5</a></li>
+    <li><a href="#">&raquo;</a></li>
+  </ul>
+</nav>
 {% endexample %}
 
 ### Disabled and active states
@@ -26,25 +28,29 @@ Simple pagination inspired by Rdio, great for apps and search results. The large
 Links are customizable for different circumstances. Use `.disabled` for unclickable links and `.active` to indicate the current page.
 
 {% example html %}
-<ul class="pagination">
-  <li class="disabled"><a href="#">&laquo;</a></li>
-  <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
-  <li><a href="#">2</a></li>
-  <li><a href="#">3</a></li>
-  <li><a href="#">4</a></li>
-  <li><a href="#">5</a></li>
-  <li><a href="#">&raquo;</a></li>
-</ul>
+<nav>
+  <ul class="pagination">
+    <li class="disabled"><a href="#">&laquo;</a></li>
+    <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
+    <li><a href="#">2</a></li>
+    <li><a href="#">3</a></li>
+    <li><a href="#">4</a></li>
+    <li><a href="#">5</a></li>
+    <li><a href="#">&raquo;</a></li>
+  </ul>
+</nav>
 {% endexample %}
 
 You can optionally swap out active or disabled anchors for `<span>` to remove click functionality while retaining intended styles.
 
 {% highlight html %}
-<ul class="pagination">
-  <li class="disabled"><span>&laquo;</span></li>
-  <li class="active"><span>1 <span class="sr-only">(current)</span></span></li>
-  ...
-</ul>
+<nav>
+  <ul class="pagination">
+    <li class="disabled"><span>&laquo;</span></li>
+    <li class="active"><span>1 <span class="sr-only">(current)</span></span></li>
+    ...
+  </ul>
+</nav>
 {% endhighlight %}
 
 
@@ -53,23 +59,27 @@ You can optionally swap out active or disabled anchors for `<span>` to remove cl
 Fancy larger or smaller pagination? Add `.pagination-lg` or `.pagination-sm` for additional sizes.
 
 {% example html %}
-<ul class="pagination pagination-lg">
-  <li><a href="#">&laquo;</a></li>
-  <li><a href="#">1</a></li>
-  <li><a href="#">2</a></li>
-  <li><a href="#">3</a></li>
-  <li><a href="#">&raquo;</a></li>
-</ul>
+<nav>
+  <ul class="pagination pagination-lg">
+    <li><a href="#">&laquo;</a></li>
+    <li><a href="#">1</a></li>
+    <li><a href="#">2</a></li>
+    <li><a href="#">3</a></li>
+    <li><a href="#">&raquo;</a></li>
+  </ul>
+</nav>
 {% endexample %}
 
 {% example html %}
-<ul class="pagination pagination-sm">
-  <li><a href="#">&laquo;</a></li>
-  <li><a href="#">1</a></li>
-  <li><a href="#">2</a></li>
-  <li><a href="#">3</a></li>
-  <li><a href="#">&raquo;</a></li>
-</ul>
+<nav>
+  <ul class="pagination pagination-sm">
+    <li><a href="#">&laquo;</a></li>
+    <li><a href="#">1</a></li>
+    <li><a href="#">2</a></li>
+    <li><a href="#">3</a></li>
+    <li><a href="#">&raquo;</a></li>
+  </ul>
+</nav>
 {% endexample %}
 
 ## Pager
@@ -81,10 +91,12 @@ Quick previous and next links for simple pagination implementations with light m
 By default, the pager centers links.
 
 {% example html %}
-<ul class="pager">
-  <li><a href="#">Previous</a></li>
-  <li><a href="#">Next</a></li>
-</ul>
+<nav>
+  <ul class="pager">
+    <li><a href="#">Previous</a></li>
+    <li><a href="#">Next</a></li>
+  </ul>
+</nav>
 {% endexample %}
 
 ### Aligned links
@@ -92,10 +104,12 @@ By default, the pager centers links.
 Alternatively, you can align each link to the sides:
 
 {% example html %}
-<ul class="pager">
-  <li class="previous"><a href="#">&larr; Older</a></li>
-  <li class="next"><a href="#">Newer &rarr;</a></li>
-</ul>
+<nav>
+  <ul class="pager">
+    <li class="previous"><a href="#">&larr; Older</a></li>
+    <li class="next"><a href="#">Newer &rarr;</a></li>
+  </ul>
+</nav>
 {% endexample %}
 
 
@@ -104,8 +118,10 @@ Alternatively, you can align each link to the sides:
 Pager links also use the `.disabled` class.
 
 {% highlight html %}
-<ul class="pager">
-  <li class="previous disabled"><a href="#">&larr; Older</a></li>
-  <li class="next"><a href="#">Newer &rarr;</a></li>
-</ul>
+<nav>
+  <ul class="pager">
+    <li class="previous disabled"><a href="#">&larr; Older</a></li>
+    <li class="next"><a href="#">Newer &rarr;</a></li>
+  </ul>
+</nav>
 {% endhighlight %}

docs/customize.html

@@ -7,7 +7,6 @@ lead: Customize Bootstrap's components, Less variables, and jQuery plugins to ge
 
 <!-- less.js isn't IE8-compatible and throws an exception during initialization, so our Blob compatibility check and error messaging code never get called in that case.
   So we use a conditional comment instead to inform folks about the lack of IE8 support.
-  The alert covers up the entire customizer UI.
 -->
 <!--[if lt IE 9]>
   <style>
@@ -17,7 +16,7 @@ lead: Customize Bootstrap's components, Less variables, and jQuery plugins to ge
       display: none;
     }
   </style>
-  <div class="alert alert-danger bs-customizer-alert-ie">
+  <div class="alert alert-danger">
     <strong>The Bootstrap Customizer does not support IE9 and below.</strong><br>
     Please take a second to <a href="http://browsehappy.com/">upgrade to a more modern browser</a>.
   </div>

docs/dist/css/bootstrap.css

@@ -205,8 +205,8 @@ th {
   abbr[title]:after {
     content: " (" attr(title) ")";
   }
-  a[href^="javascript:"]:after,
-  a[href^="#"]:after {
+  a[href^="#"]:after,
+  a[href^="javascript:"]:after {
     content: "";
   }
   pre,
@@ -241,10 +241,6 @@ th {
   .navbar {
     display: none;
   }
-  .table td,
-  .table th {
-    background-color: #fff !important;
-  }
   .btn > .caret,
   .dropup > .btn > .caret {
     border-top-color: #000 !important;
@@ -255,6 +251,10 @@ th {
   .table {
     border-collapse: collapse !important;
   }
+  .table td,
+  .table th {
+    background-color: #fff !important;
+  }
   .table-bordered th,
   .table-bordered td {
     border: 1px solid #ddd !important;
@@ -2933,8 +2933,8 @@ tbody.collapse.in {
 [data-toggle="buttons"] > .btn input[type="checkbox"],
 [data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
   position: absolute;
-  z-index: -1;
-  opacity: 0;
+  clip: rect(0, 0, 0, 0);
+  pointer-events: none;
 }
 .input-group {
   position: relative;
@@ -3500,6 +3500,9 @@ select[multiple].input-group-sm > .input-group-btn > .btn {
   .navbar-form .form-group {
     margin-bottom: 5px;
   }
+  .navbar-form .form-group:last-child {
+    margin-bottom: 0;
+  }
 }
 @media (min-width: 48em) {
   .navbar-form {
@@ -3659,7 +3662,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
 }
 .navbar-inverse .navbar-brand > a,
 .navbar-inverse .nav-pills > .nav-item > .nav-link {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-brand > a:hover,
 .navbar-inverse .nav-pills > .nav-item > .nav-link:hover,
@@ -3678,7 +3681,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   background-color: #1f2021;
 }
 .navbar-inverse .navbar-brand {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-brand:hover,
 .navbar-inverse .navbar-brand:focus {
@@ -3689,7 +3692,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   color: #a2a8ae;
 }
 .navbar-inverse .navbar-nav > li > a {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-nav > li > a:hover,
 .navbar-inverse .navbar-nav > li > a:focus {
@@ -3736,7 +3739,7 @@ fieldset[disabled] .navbar-default .btn-link:focus {
     background-color: #1f2021;
   }
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
-    color: #818a91;
+    color: #aab0b5;
   }
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover,
   .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
@@ -3757,13 +3760,13 @@ fieldset[disabled] .navbar-default .btn-link:focus {
   }
 }
 .navbar-inverse .navbar-link {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .navbar-link:hover {
   color: #fff;
 }
 .navbar-inverse .btn-link {
-  color: #818a91;
+  color: #aab0b5;
 }
 .navbar-inverse .btn-link:hover,
 .navbar-inverse .btn-link:focus {
@@ -4164,7 +4167,7 @@ a.list-group-item.active > .badge,
   margin-left: 3px;
 }
 .jumbotron {
-  padding: 2rem;
+  padding: 2rem 1rem;
   margin-bottom: 2rem;
   color: inherit;
   background-color: #eceeef;
@@ -4176,7 +4179,8 @@ a.list-group-item.active > .badge,
 .jumbotron > hr {
   border-top-color: #d0d5d8;
 }
-.container .jumbotron {
+.container .jumbotron,
+.container-fluid .jumbotron {
   border-radius: .3rem;
 }
 .jumbotron .container {
@@ -4184,8 +4188,7 @@ a.list-group-item.active > .badge,
 }
 @media screen and (min-width: 48em) {
   .jumbotron {
-    padding-top: 3.2rem;
-    padding-bottom: 3.2rem;
+    padding: 3.2rem 0;
   }
   .container .jumbotron {
     padding-right: 4rem;
@@ -4934,6 +4937,9 @@ button.close {
   display: none;
   max-width: 276px;
   padding: 1px;
+  font-size: 1rem;
+  font-weight: normal;
+  line-height: 1.5;
   text-align: left;
   white-space: normal;
   background-color: #fff;
@@ -4960,8 +4966,6 @@ button.close {
   padding: 8px 14px;
   margin: 0;
   font-size: 1rem;
-  font-weight: normal;
-  line-height: 18px;
   background-color: #f7f7f7;
   border-bottom: 1px solid #ebebeb;
   border-radius: -.7rem -.7rem 0 0;

docs/dist/js/bootstrap.js

@@ -104,7 +104,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     if (e) e.preventDefault()
 
     if (!$parent.length) {
-      $parent = $this.hasClass('alert') ? $this : $this.parent()
+      $parent = $this.closest('.alert')
     }
 
     $parent.trigger(e = $.Event('close.bs.alert'))
@@ -553,7 +553,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     this.$element.trigger(startEvent)
     if (startEvent.isDefaultPrevented()) return
 
-    var actives = this.$parent && this.$parent.find('> .panel > .in')
+    var actives = this.$parent && this.$parent.find('> .panel').children('.in, .collapsing')
 
     if (actives && actives.length) {
       var hasData = actives.data('bs.collapse')
@@ -567,6 +567,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     this.$element
       .removeClass('collapse')
       .addClass('collapsing')[dimension](0)
+      .attr('aria-expanded', true)
 
     this.transitioning = 1
 
@@ -602,15 +603,16 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     this.$element
       .addClass('collapsing')
       .removeClass('collapse in')
+      .attr('aria-expanded', false)
 
     this.transitioning = 1
 
     var complete = function () {
       this.transitioning = 0
       this.$element
-        .trigger('hidden.bs.collapse')
         .removeClass('collapsing')
         .addClass('collapse')
+        .trigger('hidden.bs.collapse')
     }
 
     if (!$.support.transition) return complete.call(this)
@@ -635,7 +637,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
       var data    = $this.data('bs.collapse')
       var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)
 
-      if (!data && options.toggle && option == 'show') option = !option
+      if (!data && options.toggle && option == 'show') options.toggle = false
       if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))
       if (typeof option == 'string') data[option]()
     })
@@ -672,8 +674,9 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var $parent = parent && $(parent)
 
     if (!data || !data.transitioning) {
-      if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed')
-      $this.toggleClass('collapsed', $target.hasClass('in'))
+      if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed').attr('aria-expanded', false)
+      var isCollapsed = $target.hasClass('in')
+      $this.toggleClass('collapsed', isCollapsed).attr('aria-expanded', !isCollapsed)
     }
 
     Plugin.call($target, option)
@@ -1012,7 +1015,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
       this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
         .appendTo(this.$body)
 
-      this.$element.on('mousedown.dismiss.bs.modal', $.proxy(function (e) {
+      this.$element.on('click.dismiss.bs.modal', $.proxy(function (e) {
         if (e.target !== e.currentTarget) return
         this.options.backdrop == 'static'
           ? this.$element[0].focus.call(this.$element[0])
@@ -1050,8 +1053,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
   }
 
   Modal.prototype.checkScrollbar = function () {
-    if (document.body.clientWidth >= window.innerWidth) return
-    this.scrollbarWidth = this.scrollbarWidth || this.measureScrollbar()
+    this.scrollbarWidth = this.measureScrollbar()
   }
 
   Modal.prototype.setScrollbar = function () {
@@ -1064,6 +1066,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
   }
 
   Modal.prototype.measureScrollbar = function () { // thx walsh
+    if (document.body.clientWidth >= window.innerWidth) return 0
     var scrollDiv = document.createElement('div')
     scrollDiv.className = 'modal-scrollbar-measure'
     this.$body.append(scrollDiv)
@@ -1232,6 +1235,11 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var self = obj instanceof this.constructor ?
       obj : $(obj.currentTarget).data('bs.' + this.type)
 
+    if (self && self.$tip && self.$tip.is(':visible')) {
+      self.hoverState = 'in'
+      return
+    }
+
     if (!self) {
       self = new this.constructor(obj.currentTarget, this.getDelegateOptions())
       $(obj.currentTarget).data('bs.' + this.type, self)
@@ -1274,7 +1282,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     if (this.hasContent() && this.enabled) {
       this.$element.trigger(e)
 
-      var inDom = $.contains(document.documentElement, this.$element[0])
+      var inDom = $.contains(this.$element[0].ownerDocument.documentElement, this.$element[0])
       if (e.isDefaultPrevented() || !inDom) return
       var that = this
 
@@ -1383,16 +1391,18 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     if (delta.left) offset.left += delta.left
     else offset.top += delta.top
 
-    var arrowDelta          = delta.left ? delta.left * 2 - width + actualWidth : delta.top * 2 - height + actualHeight
-    var arrowPosition       = delta.left ? 'left'        : 'top'
-    var arrowOffsetPosition = delta.left ? 'offsetWidth' : 'offsetHeight'
+    var isVertical          = /top|bottom/.test(placement)
+    var arrowDelta          = isVertical ? delta.left * 2 - width + actualWidth : delta.top * 2 - height + actualHeight
+    var arrowOffsetPosition = isVertical ? 'offsetWidth' : 'offsetHeight'
 
     $tip.offset(offset)
-    this.replaceArrow(arrowDelta, $tip[0][arrowOffsetPosition], arrowPosition)
+    this.replaceArrow(arrowDelta, $tip[0][arrowOffsetPosition], isVertical)
   }
 
-  Tooltip.prototype.replaceArrow = function (delta, dimension, position) {
-    this.arrow().css(position, delta ? (50 * (1 - delta / dimension) + '%') : '')
+  Tooltip.prototype.replaceArrow = function (delta, dimension, isHorizontal) {
+    this.arrow()
+      .css(isHorizontal ? 'left' : 'top', 50 * (1 - delta / dimension) + '%')
+      .css(isHorizontal ? 'top' : 'left', '')
   }
 
   Tooltip.prototype.setContent = function () {
@@ -1403,16 +1413,17 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     $tip.removeClass('fade in top bottom left right')
   }
 
-  Tooltip.prototype.hide = function () {
+  Tooltip.prototype.hide = function (callback) {
     var that = this
     var $tip = this.tip()
     var e    = $.Event('hide.bs.' + this.type)
 
-    this.$element.removeAttr('aria-describedby')
-
     function complete() {
       if (that.hoverState != 'in') $tip.detach()
-      that.$element.trigger('hidden.bs.' + that.type)
+      that.$element
+        .removeAttr('aria-describedby')
+        .trigger('hidden.bs.' + that.type)
+      callback && callback()
     }
 
     this.$element.trigger(e)
@@ -1450,7 +1461,11 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var isBody = el.tagName == 'BODY'
     var isSvg  = window.SVGElement && el instanceof window.SVGElement
 
-    var elRect    = el.getBoundingClientRect ? el.getBoundingClientRect() : null
+    var elRect    = el.getBoundingClientRect()
+    if (elRect.width == null) {
+      // width and height are missing in IE8, so compute them manually; see https://github.com/twbs/bootstrap/issues/14093
+      elRect = $.extend({}, elRect, { width: elRect.right - elRect.left, height: elRect.bottom - elRect.top })
+    }
     var elOffset  = isBody ? { top: 0, left: 0 } : $element.offset()
     var scroll    = { scroll: isBody ? document.documentElement.scrollTop || document.body.scrollTop : $element.scrollTop() }
     var outerDims = isSvg ? {} : {
@@ -1522,14 +1537,6 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     return (this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow'))
   }
 
-  Tooltip.prototype.validate = function () {
-    if (!this.$element[0].parentNode) {
-      this.hide()
-      this.$element = null
-      this.options  = null
-    }
-  }
-
   Tooltip.prototype.enable = function () {
     this.enabled = true
   }
@@ -1556,8 +1563,11 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
   }
 
   Tooltip.prototype.destroy = function () {
+    var that = this
     clearTimeout(this.timeout)
-    this.hide().$element.off('.' + this.type).removeData('bs.' + this.type)
+    this.hide(function () {
+      that.$element.off('.' + that.type).removeData('bs.' + that.type)
+    })
   }
 
 
@@ -1640,7 +1650,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
     var content = this.getContent()
 
     $tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)
-    $tip.find('.popover-content').empty()[ // we use append for html objects to maintain js events
+    $tip.find('.popover-content').children().detach().end()[ // we use append for html objects to maintain js events
       this.options.html ? (typeof content == 'string' ? 'html' : 'append') : 'text'
     ](content)
 
@@ -1773,6 +1783,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
         return ($href
           && $href.length
           && $href.is(':visible')
+          && $el.is(':visible')
           && [[$href[offsetMethod]().top + offsetBase, href]]) || null
       })
       .sort(function (a, b) { return a[0] - b[0] })
@@ -2162,8 +2173,8 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
 
       data.offset = data.offset || {}
 
-      if (data.offsetBottom) data.offset.bottom = data.offsetBottom
-      if (data.offsetTop)    data.offset.top    = data.offsetTop
+      if (data.offsetBottom != null) data.offset.bottom = data.offsetBottom
+      if (data.offsetTop    != null) data.offset.top    = data.offsetTop
 
       Plugin.call($spy, data)
     })

docs/examples/blog/index.html

@@ -104,10 +104,12 @@
             <p>Donec ullamcorper nulla non metus auctor fringilla. Nulla vitae elit libero, a pharetra augue.</p>
           </div><!-- /.blog-post -->
 
-          <ul class="pager">
-            <li><a href="#">Previous</a></li>
-            <li><a href="#">Next</a></li>
-          </ul>
+          <nav>
+            <ul class="pager">
+              <li><a href="#">Previous</a></li>
+              <li><a href="#">Next</a></li>
+            </ul>
+          </nav>
 
         </div><!-- /.blog-main -->
 

docs/examples/carousel/index.html

@@ -25,10 +25,10 @@
     <div class="navbar-wrapper">
       <div class="container">
 
-        <div class="navbar navbar-inverse navbar-static-top" role="navigation">
+        <nav class="navbar navbar-inverse navbar-static-top" role="navigation">
           <div class="container">
             <div class="navbar-header">
-              <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+              <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                 <span class="sr-only">Toggle navigation</span>
                 <span class="icon-bar"></span>
                 <span class="icon-bar"></span>
@@ -36,7 +36,7 @@
               </button>
               <a class="navbar-brand" href="#">Project name</a>
             </div>
-            <div class="navbar-collapse collapse">
+            <div id="navbar" class="navbar-collapse collapse">
               <ul class="nav navbar-nav">
                 <li class="active"><a href="#">Home</a></li>
                 <li><a href="#about">About</a></li>
@@ -56,7 +56,7 @@
               </ul>
             </div>
           </div>
-        </div>
+        </nav>
 
       </div>
     </div>

docs/examples/dashboard/index.html

@@ -22,10 +22,10 @@
 
   <body>
 
-    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
       <div class="container-fluid">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -33,7 +33,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="navbar-collapse collapse">
+        <div id="navbar" class="navbar-collapse collapse">
           <ul class="nav navbar-nav navbar-right">
             <li><a href="#">Dashboard</a></li>
             <li><a href="#">Settings</a></li>
@@ -45,7 +45,7 @@
           </form>
         </div>
       </div>
-    </div>
+    </nav>
 
     <div class="container-fluid">
       <div class="row">

docs/examples/jumbotron/index.html

@@ -22,10 +22,10 @@
 
   <body>
 
-    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -33,7 +33,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="navbar-collapse collapse">
+        <div id="navbar" class="navbar-collapse collapse">
           <form class="navbar-form navbar-right" role="form">
             <div class="form-group">
               <input type="text" placeholder="Email" class="form-control">
@@ -45,7 +45,7 @@
           </form>
         </div><!--/.navbar-collapse -->
       </div>
-    </div>
+    </nav>
 
     <!-- Main jumbotron for a primary marketing message or call to action -->
     <div class="jumbotron">

docs/examples/navbar-fixed-top/index.html

@@ -23,10 +23,10 @@
   <body>
 
     <!-- Fixed navbar -->
-    <div class="navbar navbar-default navbar-fixed-top" role="navigation">
+    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -34,7 +34,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="navbar-collapse collapse">
+        <div id="navbar" class="navbar-collapse collapse">
           <ul class="nav navbar-nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#about">About</a></li>
@@ -59,7 +59,7 @@
           </ul>
         </div><!--/.nav-collapse -->
       </div>
-    </div>
+    </nav>
 
     <div class="container">
 

docs/examples/navbar-static-top/index.html

@@ -23,10 +23,10 @@
   <body>
 
     <!-- Static navbar -->
-    <div class="navbar navbar-default navbar-static-top" role="navigation">
+    <nav class="navbar navbar-default navbar-static-top" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -34,7 +34,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="navbar-collapse collapse">
+        <div id="navbar" class="navbar-collapse collapse">
           <ul class="nav navbar-nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#about">About</a></li>
@@ -59,7 +59,7 @@
           </ul>
         </div><!--/.nav-collapse -->
       </div>
-    </div>
+    </nav>
 
 
     <div class="container">

docs/examples/navbar/index.html

@@ -25,10 +25,10 @@
     <div class="container">
 
       <!-- Static navbar -->
-      <div class="navbar navbar-default" role="navigation">
+      <nav class="navbar navbar-default" role="navigation">
         <div class="container-fluid">
           <div class="navbar-header">
-            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
               <span class="sr-only">Toggle navigation</span>
               <span class="icon-bar"></span>
               <span class="icon-bar"></span>
@@ -36,7 +36,7 @@
             </button>
             <a class="navbar-brand" href="#">Project name</a>
           </div>
-          <div class="navbar-collapse collapse">
+          <div id="navbar" class="navbar-collapse collapse">
             <ul class="nav navbar-nav">
               <li class="active"><a href="#">Link</a></li>
               <li><a href="#">Link</a></li>
@@ -61,7 +61,7 @@
             </ul>
           </div><!--/.nav-collapse -->
         </div><!--/.container-fluid -->
-      </div>
+      </nav>
 
       <!-- Main component for a primary marketing message or call to action -->
       <div class="jumbotron">

docs/examples/non-responsive/index.html

@@ -25,10 +25,10 @@
   <body>
 
     <!-- Fixed navbar -->
-    <div class="navbar navbar-default navbar-fixed-top" role="navigation">
+    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -36,7 +36,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="navbar-collapse collapse">
+        <div id="navbar" class="navbar-collapse collapse">
           <ul class="nav navbar-nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#about">About</a></li>
@@ -61,7 +61,7 @@
           </ul>
         </div><!--/.nav-collapse -->
       </div>
-    </div>
+    </nav>
 
     <div class="container">
 

docs/examples/offcanvas/index.html

@@ -21,10 +21,10 @@
   </head>
 
   <body>
-    <div class="navbar navbar-fixed-top navbar-inverse" role="navigation">
+    <nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -32,7 +32,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="collapse navbar-collapse">
+        <div id="navbar" class="collapse navbar-collapse">
           <ul class="nav navbar-nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#about">About</a></li>
@@ -40,7 +40,7 @@
           </ul>
         </div><!-- /.nav-collapse -->
       </div><!-- /.container -->
-    </div><!-- /.navbar -->
+    </nav><!-- /.navbar -->
 
     <div class="container">
 
@@ -55,32 +55,32 @@
             <p>This is an example to show the potential of an offcanvas layout pattern in Bootstrap. Try some responsive-range viewport sizes to see it in action.</p>
           </div>
           <div class="row">
-            <div class="col-6 col-sm-6 col-lg-4">
+            <div class="col-xs-6 col-lg-4">
               <h2>Heading</h2>
               <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
               <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
             </div><!--/span-->
-            <div class="col-6 col-sm-6 col-lg-4">
+            <div class="col-xs-6 col-lg-4">
               <h2>Heading</h2>
               <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
               <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
             </div><!--/span-->
-            <div class="col-6 col-sm-6 col-lg-4">
+            <div class="col-xs-6 col-lg-4">
               <h2>Heading</h2>
               <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
               <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
             </div><!--/span-->
-            <div class="col-6 col-sm-6 col-lg-4">
+            <div class="col-xs-6 col-lg-4">
               <h2>Heading</h2>
               <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
               <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
             </div><!--/span-->
-            <div class="col-6 col-sm-6 col-lg-4">
+            <div class="col-xs-6 col-lg-4">
               <h2>Heading</h2>
               <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
               <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
             </div><!--/span-->
-            <div class="col-6 col-sm-6 col-lg-4">
+            <div class="col-xs-6 col-lg-4">
               <h2>Heading</h2>
               <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
               <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>

docs/examples/starter-template/index.html

@@ -22,10 +22,10 @@
 
   <body>
 
-    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -33,7 +33,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="collapse navbar-collapse">
+        <div id="navbar" class="collapse navbar-collapse">
           <ul class="nav navbar-nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#about">About</a></li>
@@ -41,7 +41,7 @@
           </ul>
         </div><!--/.nav-collapse -->
       </div>
-    </div>
+    </nav>
 
     <div class="container">
 

docs/examples/sticky-footer-navbar/index.html

@@ -23,10 +23,10 @@
   <body>
 
     <!-- Fixed navbar -->
-    <div class="navbar navbar-default navbar-fixed-top" role="navigation">
+    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -34,7 +34,7 @@
           </button>
           <a class="navbar-brand" href="#">Project name</a>
         </div>
-        <div class="collapse navbar-collapse">
+        <div id="navbar" class="collapse navbar-collapse">
           <ul class="nav navbar-nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#about">About</a></li>
@@ -54,7 +54,7 @@
           </ul>
         </div><!--/.nav-collapse -->
       </div>
-    </div>
+    </nav>
 
     <!-- Begin page content -->
     <div class="container">

docs/examples/theme/index.html

@@ -25,10 +25,10 @@
   <body role="document">
 
     <!-- Fixed navbar -->
-    <div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
+    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
       <div class="container">
         <div class="navbar-header">
-          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
+          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
             <span class="sr-only">Toggle navigation</span>
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
@@ -36,7 +36,7 @@
           </button>
           <a class="navbar-brand" href="#">Bootstrap theme</a>
         </div>
-        <div class="navbar-collapse collapse">
+        <div id="navbar" class="navbar-collapse collapse">
           <ul class="nav navbar-nav">
             <li class="active"><a href="#">Home</a></li>
             <li><a href="#about">About</a></li>
@@ -56,7 +56,7 @@
           </ul>
         </div><!--/.nav-collapse -->
       </div>
-    </div>
+    </nav>
 
     <div class="container theme-showcase" role="main">
 
@@ -371,7 +371,7 @@
         <h1>Navbars</h1>
       </div>
 
-      <div class="navbar navbar-default">
+      <nav class="navbar navbar-default">
         <div class="container">
           <div class="navbar-header">
             <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
@@ -402,9 +402,9 @@
             </ul>
           </div><!--/.nav-collapse -->
         </div>
-      </div>
+      </nav>
 
-      <div class="navbar navbar-inverse">
+      <nav class="navbar navbar-inverse">
         <div class="container">
           <div class="navbar-header">
             <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target=".navbar-collapse">
@@ -435,7 +435,7 @@
             </ul>
           </div><!--/.nav-collapse -->
         </div>
-      </div>
+      </nav>
 
 
 

docs/getting-started/compiling.md

@@ -29,6 +29,9 @@ Run `grunt` to run tests locally and compile the CSS and JavaScript into `/dist`
 #### Tests - `grunt test`
 Runs [JSHint](http://jshint.com) and [QUnit](http://qunitjs.com/) tests headlessly in [PhantomJS](http://phantomjs.org/) (used for CI).
 
+#### Tests and assets - `grunt docs`
+Compiles and tests CSS, JavaScript, and more for running the local documentation via `jekyll serve`.
+
 #### Watch - `grunt watch`
 This is a convenience method for watching just Less files and automatically building them whenever you save.
 

docs/getting-started/support.md

@@ -213,3 +213,11 @@ $(function () {
 {% endhighlight %}
 
 Want to see an example? [Check out this JS Bin demo.](http://jsbin.com/OyaqoDO/2)
+
+### Validators
+
+In order to provide the best possible experience to old and buggy browsers, Bootstrap uses [CSS browser hacks](http://browserhacks.com) in several places to target special CSS to certain browser versions in order to work around bugs in the browsers themselves. These hacks understandably cause CSS validators to complain that they are invalid. In a couple places, we also use bleeding-edge CSS features that aren't yet fully standardized, but these are used purely for progressive enhancement.
+
+These validation warnings don't matter in practice since the non-hacky portion of our CSS does fully validate and the hacky portions don't interfere with the proper functioning of the non-hacky portion, hence why we deliberately ignore these particular warnings.
+
+Our HTML docs likewise have some trivial and inconsequential HTML validation warnings due to our inclusion of [X-UA-Compatible `<meta>` tags](#ie-compatibility-modes) to avoid Internet Explorer issues and our inclusion of a workaround for [a certain Firefox bug](https://bugzilla.mozilla.org/show_bug.cgi?id=654072).

docs/javascript/alerts.md

@@ -39,7 +39,7 @@ $(".alert").alert()
 
 ### Markup
 
-Just add `data-dismiss="alert"` to your close button to automatically give an alert close functionality.
+Just add `data-dismiss="alert"` to your close button to automatically give an alert close functionality. Closing an alert removes it from the DOM.
 
 {% highlight html %}
 <button type="button" class="close" data-dismiss="alert">
@@ -48,7 +48,7 @@ Just add `data-dismiss="alert"` to your close button to automatically give an al
 </button>
 {% endhighlight %}
 
-To have your alerts use animation when closing, make sure they have the `.fade` and `.in` class already applied to them.
+To have your alerts use animation when closing, make sure they have the `.fade` and `.in` classes already applied to them.
 
 ### Methods
 
@@ -58,13 +58,13 @@ Makes an alert listen for click events on descendant elements which have the `da
 
 #### $().alert('close')
 
-Closes an alert.
+Closes an alert by removing it from the DOM. If the `.fade` and `.in` classes are present on the element, the alert will fade out before it is removed.
 
 {% highlight js %}$(".alert").alert('close'){% endhighlight %}
 
 ### Events
 
-Bootstrap's alert class exposes a few events for hooking into alert functionality.
+Bootstrap's alert plugin exposes a few events for hooking into alert functionality.
 
 <div class="table-responsive">
   <table class="table table-bordered table-striped">

docs/javascript/buttons.md

@@ -3,111 +3,88 @@ layout: page
 title: Buttons
 ---
 
+
 Do more with buttons. Control button states or create groups of buttons for more components like toolbars.
 
-## Uses
+<div class="bs-callout bs-callout-danger">
+  <h4>Cross-browser compatibility</h4>
+  <p><a href="https://github.com/twbs/bootstrap/issues/793">Firefox persists form control states (disabledness and checkedness) across page loads</a>. A workaround for this is to use <code>autocomplete="off"</code>.</p>
+</div>
 
-#### Stateful
+## Stateful
 
 Add `data-loading-text="Loading..."` to use a loading state on a button.
 
+<div class="bs-callout bs-callout-info">
+  <h4>Use whichever state you like!</h4>
+  <p>For the sake of this demonstration, we are using <code>data-loading-text</code> and <code>$().button('loading')</code>, but that's not the only state you can use. <a href="#buttons-methods">See more on this below in the <code>$().button(string)</code> documentation</a>.</p>
+</div>
+
 {% example html %}
-<button type="button" id="loading-example-btn" data-loading-text="Loading..." class="btn btn-primary">
+<button type="button" id="myButton" data-loading-text="Loading..." class="btn btn-primary" autocomplete="off">
   Loading state
 </button>
 <script>
-  $('#loading-example-btn').click(function () {
-    var btn = $(this)
-    btn.button('loading')
-    $.ajax(...).always(function () {
-      btn.button('reset')
-    });
-  });
+  $('#myButton').on('click', function () {
+    var $btn = $(this).button('loading')
+    // business logic...
+    $btn.button('reset')
+  })
 </script>
 {% endexample %}
 
-#### Single toggle
+### Single toggle
 
 Add `data-toggle="button"` to activate toggling on a single button.
 
 {% example html %}
-<button type="button" class="btn btn-primary" data-toggle="button">
+<button type="button" class="btn btn-primary" data-toggle="button" autocomplete="off">
   Single toggle
 </button>
 {% endexample %}
 
-#### Checkbox
+## Checkbox and radio
 
-Add `data-toggle="buttons"` to a group of checkboxes for checkbox style toggling on btn-group.
+Add `data-toggle="buttons"` to a `.btn-group` containing checkbox or radio inputs to enable toggling in their respective styles.
 
 <div class="bs-callout bs-callout-warning">
-  <h4>Pre-checked options need <code>.active</code></h4>
-  <p>For pre-checked options, you must add the <code>.active</code> class to the input's <code>label</code> yourself.</p>
+  <h4>Preselected options need <code>.active</code></h4>
+  <p>For preselected options, you must add the <code>.active</code> class to the input's <code>label</code> yourself.</p>
 </div>
-
 <div class="bs-callout bs-callout-warning">
   <h4>Visual checked state only updated on click</h4>
   <p>If the checked state of a checkbox button is updated without firing a <code>click</code> event on the button (e.g. via <code>&lt;input type="reset"&gt;</code> or via setting the <code>checked</code> property of the input), you will need to toggle the <code>.active</code> class on the input's <code>label</code> yourself.</p>
 </div>
 
 {% example html %}
-<div class="btn-group" data-toggle="buttons">
-  <label class="btn btn-primary active">
-    <input type="checkbox" autocomplete="off" checked> Option 1 (pre-checked)
-  </label>
-  <label class="btn btn-primary">
-    <input type="checkbox" autocomplete="off"> Option 2
-  </label>
-  <label class="btn btn-primary">
-    <input type="checkbox" autocomplete="off"> Option 3
-  </label>
+<div class="bs-example">
+  <div class="btn-group" data-toggle="buttons">
+    <label class="btn btn-primary active">
+      <input type="checkbox" checked autocomplete="off"> Checkbox 1 (pre-checked)
+    </label>
+    <label class="btn btn-primary">
+      <input type="checkbox" autocomplete="off"> Checkbox 2
+    </label>
+    <label class="btn btn-primary">
+      <input type="checkbox" autocomplete="off"> Checkbox 3
+    </label>
+  </div>
 </div>
 {% endexample %}
 
-#### Radio
-
-Add `data-toggle="buttons"` to a group of radio inputs for radio style toggling on btn-group.
-
-<div class="bs-callout bs-callout-warning">
-  <h4>Preselected options need <code>.active</code></h4>
-  <p>For preselected options, you must add the <code>.active</code> class to the input's <code>label</code> yourself.</p>
-</div>
-
-<div class="bs-callout bs-callout-warning">
-  <h4>Visual checked state only updated on click</h4>
-  <p>If the checked state of a checkbox button is updated without firing a <code>click</code> event on the button (e.g. via <code>&lt;input type="reset"&gt;</code> or via setting the <code>checked</code> property of the input), you will need to toggle the <code>.active</code> class on the input's <code>label</code> yourself.</p>
-</div>
-
-{% highlight html %}
+{% example html %}
 <div class="btn-group" data-toggle="buttons">
   <label class="btn btn-primary active">
-    <input type="radio" name="options" id="option1" autocomplete="off" checked> Option 1 (preselected)
+    <input type="radio" name="options" id="option1" autocomplete="off" checked> Radio 1 (preselected)
   </label>
   <label class="btn btn-primary">
-    <input type="radio" name="options" id="option2" autocomplete="off"> Option 2
+    <input type="radio" name="options" id="option2" autocomplete="off"> Radio 2
   </label>
   <label class="btn btn-primary">
-    <input type="radio" name="options" id="option3" autocomplete="off"> Option 3
+    <input type="radio" name="options" id="option3" autocomplete="off"> Radio 3
   </label>
 </div>
-{% endhighlight %}
-
-
-## Usage
-
-Enable buttons via JavaScript:
-
-{% highlight js %}
-$('.btn').button()
-{% endhighlight %}
-
-### Markup
-
-Data attributes are integral to the button plugin. Check out the example code below for the various markup types.
-
-### Options
-
-*None.*
+{% endexample %}
 
 ### Methods
 
@@ -115,48 +92,21 @@ Data attributes are integral to the button plugin. Check out the example code be
 
 Toggles push state. Gives the button the appearance that it has been activated.
 
-<div class="bs-callout bs-callout-info">
-  <h4>Auto toggling</h4>
-  <p>You can enable auto toggling of a button by using the <code>data-toggle</code> attribute.</p>
-</div>
-
-{% highlight html %}
-<button type="button" class="btn btn-primary" data-toggle="button">...</button>
-{% endhighlight %}
-
-#### $().button('loading')</h4>
-
-Sets button state to loading - disables button and swaps text to loading text. Loading text should be defined on the button element using the data attribute `data-loading-text`.
-
-{% highlight html %}
-<button id="loading-example-btn" type="button" class="btn btn-primary" data-loading-text="loading stuff...">...</button>
-<script>
-  $('#loading-example-btn').click(function () {
-    var btn = $(this)
-    btn.button('loading')
-    $.ajax(...).always(function () {
-      btn.button('reset')
-    });
-  });
-</script>
-{% endhighlight %}
-
-<div class="bs-callout bs-callout-danger">
-  <h4>Cross-browser compatibility</h4>
-  <p><a href="https://github.com/twbs/bootstrap/issues/793">Firefox persists form control states (disabledness and checkedness) across page loads</a>. A workaround for this is to use <code>autocomplete="off"</code>.</p>
-</div>
-
 #### $().button('reset')
 
-Resets button state - swaps text to original text.
+Resets button state—swaps text to original text.
 
 #### $().button(string)
 
-Resets button state - swaps text to any data defined text state.
+Swaps text to any data defined text state.
 
 {% highlight html %}
-<button type="button" class="btn btn-primary" data-complete-text="finished!" >...</button>
+<button type="button" id="myStateButton" data-complete-text="finished!" class="btn btn-primary" autocomplete="off">
+  ...
+</button>
 <script>
-  $('.btn').button('complete')
+  $('#myStateButton').on('click', function () {
+    $(this).button('complete') // button text will be "finished!"
+  })
 </script>
 {% endhighlight %}

docs/javascript/carousel.md

@@ -3,9 +3,9 @@ layout: page
 title: Carousel
 ---
 
-## Example
+A slideshow component for cycling through elements—images or slides of text—like a carousel. **Nested carousels are not supported.**
 
-The slideshow below shows a generic plugin and component for cycling through elements like a carousel.
+## Example
 
 {% example html %}
 <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">

docs/javascript/collapse.md

@@ -17,42 +17,42 @@ Using the collapse plugin, we built a simple accordion by extending the panel co
 {% example html %}
 <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
   <div class="panel panel-default">
-    <div class="panel-heading">
+    <div class="panel-heading" role="tab" id="headingOne">
       <h4 class="panel-title">
-        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
+        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
           Collapsible Group Item #1
         </a>
       </h4>
     </div>
-    <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel">
+    <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
       <div class="panel-body">
         Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
       </div>
     </div>
   </div>
   <div class="panel panel-default">
-    <div class="panel-heading">
+    <div class="panel-heading" role="tab" id="headingTwo">
       <h4 class="panel-title">
-        <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
+        <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
           Collapsible Group Item #2
         </a>
       </h4>
     </div>
-    <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel">
+    <div id="collapseTwo" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingTwo">
       <div class="panel-body">
         Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
       </div>
     </div>
   </div>
   <div class="panel panel-default">
-    <div class="panel-heading">
+    <div class="panel-heading" role="tab" id="headingThree">
       <h4 class="panel-title">
-        <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
+        <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
           Collapsible Group Item #3
         </a>
       </h4>
     </div>
-    <div id="collapseThree" class="panel-collapse collapse" role="tabpanel">
+    <div id="collapseThree" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingThree">
       <div class="panel-body">
         Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
       </div>
@@ -63,6 +63,12 @@ Using the collapse plugin, we built a simple accordion by extending the panel co
 
 You can also use the plugin without the accordion markup. Make a button toggle the expanding and collapsing of another element.
 
+<div class="bs-callout bs-callout-warning">
+  <h4>Make expand/collapse controls accessible</h4>
+  <p>Be sure to add <code>aria-expanded</code> to the control element. This attribute explicitly defines the current state of the collapsible element to screen readers and similar assistive technologies. If the collapsible element is closed by default, it should have a value of <code>aria-expanded="false"</code>. If you've set the collapsible element to be open by default using the <code>in</code> class, set <code>aria-expanded="true"</code> on the control instead. The plugin will automatically toggle this attribute based on whether or not the collapsible element has been opened or closed.</p>
+  <p>Additionally, if your control element is targetting a single collapsible element – i.e. the <code>data-target</code> attribute is pointing to an <code>id</code> selector – you may add an additional <code>aria-controls</code> attribute to the control element, containing the <code>id</code> of the collapsible element. Modern screen readers and similar assistive technologies make use of this attribute to provide users with additional shortcuts to navigate directly to the collapsible element itself.</p>
+</div>
+
 {% highlight html %}
 <button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#demo">
   simple collapsible
@@ -84,7 +90,7 @@ These classes can be found in `component-animations.less`.
 
 ### Via data attributes
 
-Just add `data-toggle="collapse"` and a `data-target` to element to automatically assign control of a collapsible element. The `data-target` attribute accepts a CSS selector to apply the collapse to. Be sure to add the class `collapse` to the collapsible element. If you'd like it to default open, add the additional class `in`.
+Just add `data-toggle="collapse"` and a `data-target` to the element to automatically assign control of a collapsible element. The `data-target` attribute accepts a CSS selector to apply the collapse to. Be sure to add the class `collapse` to the collapsible element. If you'd like it to default open, add the additional class `in`.
 
 To add accordion-like group management to a collapsible control, add the data attribute `data-parent="#selector"`. Refer to the demo to see this in action.
 
@@ -115,7 +121,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
        <td>parent</td>
        <td>selector</td>
        <td>false</td>
-       <td>If selector then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior - this dependent on the <code>panel</code> class)</td>
+       <td>If a selector is provided, then all collapsible elements under the specified parent will be closed when this collapsible item is shown. (similar to traditional accordion behavior - this is dependent on the <code>panel</code> class)</td>
      </tr>
      <tr>
        <td>toggle</td>

docs/javascript/modal.md

@@ -107,14 +107,14 @@ Toggle a modal via JavaScript by clicking the button below. It will slide down a
 </div>
 
 <div class="bs-example" style="padding-bottom: 24px;">
-  <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
+  <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
     Launch demo modal
   </button>
 </div>
 
 {% highlight html %}
 <!-- Button trigger modal -->
-<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
+<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
   Launch demo modal
 </button>
 
@@ -154,8 +154,8 @@ Toggle a modal via JavaScript by clicking the button below. It will slide down a
 Modals have two optional sizes, available via modifier classes to be placed on a `.modal-dialog`.
 
 <div class="bs-example">
-  <button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">Large modal</button>
-  <button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>
+  <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-lg">Large modal</button>
+  <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>
 </div>
 
 {% highlight html %}
@@ -171,7 +171,7 @@ Modals have two optional sizes, available via modifier classes to be placed on a
 </div>
 
 <!-- Small modal -->
-<button class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>
+<button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>
 
 <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
   <div class="modal-dialog modal-sm">

docs/javascript/popovers.md

@@ -170,7 +170,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
         <td>string | false</td>
         <td>false</td>
         <td>
-         <p>Appends the popover to a specific element. Example: <code>container: 'body'</code>. This option is particularly useful in that it allows you to position the popover in the flow of the document near the triggering element - which will prevent the popover from floating away from the triggering element during a window resize.</p>
+          <p>Appends the popover to a specific element. Example: <code>container: 'body'</code>. This option is particularly useful in that it allows you to position the popover in the flow of the document near the triggering element - which will prevent the popover from floating away from the triggering element during a window resize.</p>
         </td>
       </tr>
       <tr>
@@ -179,7 +179,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
         <td>''</td>
         <td>
           <p>Default content value if <code>data-content</code> attribute isn't present.</p>
-          <p>If a function is given, it will be called with its <code>this</code> reference set to, which is the element that the popover is attached to.</p>
+          <p>If a function is given, it will be called with its <code>this</code> reference set to the element that the popover is attached to.</p>
         </td>
       </tr>
       <tr>
@@ -218,11 +218,11 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
         <td>string</td>
         <td><code>'&lt;div class="popover" role="tooltip"&gt;&lt;div class="arrow"&gt;&lt;/div&gt;&lt;h3 class="popover-title"&gt;&lt;/h3&gt;&lt;div class="popover-content"&gt;&lt;/div&gt;&lt;/div&gt;'</code></td>
         <td>
-         <p>Base HTML to use when creating the popover.</p>
-         <p>The popover's <code>title</code> will be injected into the <code>.popover-title</code>.</p>
-         <p>The popover's <code>content</code> will be injected into the <code>.popover-content</code>.</p>
-         <p><code>.arrow</code> will become the popover's arrow.</p>
-         <p>The outermost wrapper element should have the <code>.popover</code> class.</p>
+          <p>Base HTML to use when creating the popover.</p>
+          <p>The popover's <code>title</code> will be injected into the <code>.popover-title</code>.</p>
+          <p>The popover's <code>content</code> will be injected into the <code>.popover-content</code>.</p>
+          <p><code>.arrow</code> will become the popover's arrow.</p>
+          <p>The outermost wrapper element should have the <code>.popover</code> class.</p>
         </td>
       </tr>
       <tr>
@@ -241,13 +241,13 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
         <td>How popover is triggered - click | hover | focus | manual. You may pass multiple triggers; separate them with a space.</td>
       </tr>
       <tr>
-       <td>viewport</td>
-       <td>string | object</td>
-       <td>{ selector: 'body', padding: 0 }</td>
-       <td>
-        <p>Keeps the popover within the bounds of this element. Example: <code>viewport: '#viewport'</code> or <code>{ "selector": "#viewport", "padding": 0 }</code></p>
-       </td>
-     </tr>
+        <td>viewport</td>
+        <td>string | object</td>
+        <td>{ selector: 'body', padding: 0 }</td>
+        <td>
+          <p>Keeps the popover within the bounds of this element. Example: <code>viewport: '#viewport'</code> or <code>{ "selector": "#viewport", "padding": 0 }</code></p>
+        </td>
+      </tr>
     </tbody>
   </table>
 </div>
@@ -293,27 +293,27 @@ Hides and destroys an element's popover.
   <table class="table table-bordered table-striped">
     <thead>
      <tr>
-       <th style="width: 150px;">Event Type</th>
-       <th>Description</th>
+        <th style="width: 150px;">Event Type</th>
+        <th>Description</th>
      </tr>
     </thead>
     <tbody>
-     <tr>
-       <td>show.bs.popover</td>
-       <td>This event fires immediately when the <code>show</code> instance method is called.</td>
-     </tr>
-     <tr>
-       <td>shown.bs.popover</td>
-       <td>This event is fired when the popover has been made visible to the user (will wait for CSS transitions to complete).</td>
-     </tr>
-     <tr>
-       <td>hide.bs.popover</td>
-       <td>This event is fired immediately when the <code>hide</code> instance method has been called.</td>
-     </tr>
-     <tr>
-       <td>hidden.bs.popover</td>
-       <td>This event is fired when the popover has finished being hidden from the user (will wait for CSS transitions to complete).</td>
-     </tr>
+      <tr>
+        <td>show.bs.popover</td>
+        <td>This event fires immediately when the <code>show</code> instance method is called.</td>
+      </tr>
+      <tr>
+        <td>shown.bs.popover</td>
+        <td>This event is fired when the popover has been made visible to the user (will wait for CSS transitions to complete).</td>
+      </tr>
+      <tr>
+        <td>hide.bs.popover</td>
+        <td>This event is fired immediately when the <code>hide</code> instance method has been called.</td>
+      </tr>
+      <tr>
+        <td>hidden.bs.popover</td>
+        <td>This event is fired when the popover has finished being hidden from the user (will wait for CSS transitions to complete).</td>
+      </tr>
     </tbody>
   </table>
 </div>

docs/javascript/tooltips.md

@@ -16,9 +16,40 @@ Hover over the links below to see tooltips:
   </p>
 </div>
 
-### Directions
+### Static demo
 
-Available in four directions
+Four options are available: top, right, bottom, and left aligned.
+
+<div class="bs-example bs-example-tooltip">
+  <div class="tooltip left" role="tooltip">
+    <div class="tooltip-arrow"></div>
+    <div class="tooltip-inner">
+      Tooltip on the left
+    </div>
+  </div>
+  <div class="tooltip top" role="tooltip">
+    <div class="tooltip-arrow"></div>
+    <div class="tooltip-inner">
+      Tooltip on the top
+    </div>
+  </div>
+  <div class="tooltip bottom" role="tooltip">
+    <div class="tooltip-arrow"></div>
+    <div class="tooltip-inner">
+      Tooltip on the bottom
+    </div>
+  </div>
+  <div class="tooltip right" role="tooltip">
+    <div class="tooltip-arrow"></div>
+    <div class="tooltip-inner">
+      Tooltip on the right
+    </div>
+  </div>
+</div>
+
+### Interactive demo
+
+Hover over the buttons below to see their tooltips.
 
 <div class="bs-example tooltip-demo">
   <div class="bs-example-tooltips">
@@ -100,12 +131,12 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
 <div class="table-responsive">
   <table class="table table-bordered table-striped">
     <thead>
-     <tr>
-       <th style="width: 100px;">Name</th>
-       <th style="width: 100px;">Type</th>
-       <th style="width: 50px;">Default</th>
-       <th>Description</th>
-     </tr>
+      <tr>
+        <th style="width: 100px;">Name</th>
+        <th style="width: 100px;">Type</th>
+        <th style="width: 50px;">Default</th>
+        <th>Description</th>
+      </tr>
     </thead>
     <tbody>
       <tr>
@@ -231,28 +262,28 @@ Hides and destroys an element's tooltip.
 <div class="table-responsive">
   <table class="table table-bordered table-striped">
     <thead>
-     <tr>
-       <th style="width: 150px;">Event Type</th>
-       <th>Description</th>
-     </tr>
+      <tr>
+        <th style="width: 150px;">Event Type</th>
+        <th>Description</th>
+      </tr>
     </thead>
     <tbody>
-     <tr>
-       <td>show.bs.tooltip</td>
-       <td>This event fires immediately when the <code>show</code> instance method is called.</td>
-     </tr>
-     <tr>
-       <td>shown.bs.tooltip</td>
-       <td>This event is fired when the tooltip has been made visible to the user (will wait for CSS transitions to complete).</td>
-     </tr>
-     <tr>
-       <td>hide.bs.tooltip</td>
-       <td>This event is fired immediately when the <code>hide</code> instance method has been called.</td>
-     </tr>
-     <tr>
-       <td>hidden.bs.tooltip</td>
-       <td>This event is fired when the tooltip has finished being hidden from the user (will wait for CSS transitions to complete).</td>
-     </tr>
+      <tr>
+        <td>show.bs.tooltip</td>
+        <td>This event fires immediately when the <code>show</code> instance method is called.</td>
+      </tr>
+      <tr>
+        <td>shown.bs.tooltip</td>
+        <td>This event is fired when the tooltip has been made visible to the user (will wait for CSS transitions to complete).</td>
+      </tr>
+      <tr>
+        <td>hide.bs.tooltip</td>
+        <td>This event is fired immediately when the <code>hide</code> instance method has been called.</td>
+      </tr>
+      <tr>
+        <td>hidden.bs.tooltip</td>
+        <td>This event is fired when the tooltip has finished being hidden from the user (will wait for CSS transitions to complete).</td>
+      </tr>
     </tbody>
   </table>
 </div>

js/affix.js

@@ -152,8 +152,8 @@
 
       data.offset = data.offset || {}
 
-      if (data.offsetBottom) data.offset.bottom = data.offsetBottom
-      if (data.offsetTop)    data.offset.top    = data.offsetTop
+      if (data.offsetBottom != null) data.offset.bottom = data.offsetBottom
+      if (data.offsetTop    != null) data.offset.top    = data.offsetTop
 
       Plugin.call($spy, data)
     })

js/alert.js

@@ -36,7 +36,7 @@
     if (e) e.preventDefault()
 
     if (!$parent.length) {
-      $parent = $this.hasClass('alert') ? $this : $this.parent()
+      $parent = $this.closest('.alert')
     }
 
     $parent.trigger(e = $.Event('close.bs.alert'))

js/collapse.js

@@ -42,7 +42,7 @@
     this.$element.trigger(startEvent)
     if (startEvent.isDefaultPrevented()) return
 
-    var actives = this.$parent && this.$parent.find('> .panel > .in')
+    var actives = this.$parent && this.$parent.find('> .panel').children('.in, .collapsing')
 
     if (actives && actives.length) {
       var hasData = actives.data('bs.collapse')
@@ -56,6 +56,7 @@
     this.$element
       .removeClass('collapse')
       .addClass('collapsing')[dimension](0)
+      .attr('aria-expanded', true)
 
     this.transitioning = 1
 
@@ -91,15 +92,16 @@
     this.$element
       .addClass('collapsing')
       .removeClass('collapse in')
+      .attr('aria-expanded', false)
 
     this.transitioning = 1
 
     var complete = function () {
       this.transitioning = 0
       this.$element
-        .trigger('hidden.bs.collapse')
         .removeClass('collapsing')
         .addClass('collapse')
+        .trigger('hidden.bs.collapse')
     }
 
     if (!$.support.transition) return complete.call(this)
@@ -124,7 +126,7 @@
       var data    = $this.data('bs.collapse')
       var options = $.extend({}, Collapse.DEFAULTS, $this.data(), typeof option == 'object' && option)
 
-      if (!data && options.toggle && option == 'show') option = !option
+      if (!data && options.toggle && option == 'show') options.toggle = false
       if (!data) $this.data('bs.collapse', (data = new Collapse(this, options)))
       if (typeof option == 'string') data[option]()
     })
@@ -161,8 +163,9 @@
     var $parent = parent && $(parent)
 
     if (!data || !data.transitioning) {
-      if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed')
-      $this.toggleClass('collapsed', $target.hasClass('in'))
+      if ($parent) $parent.find('[data-toggle="collapse"][data-parent="' + parent + '"]').not($this).addClass('collapsed').attr('aria-expanded', false)
+      var isCollapsed = $target.hasClass('in')
+      $this.toggleClass('collapsed', isCollapsed).attr('aria-expanded', !isCollapsed)
     }
 
     Plugin.call($target, option)

js/modal.js

@@ -169,7 +169,7 @@
       this.$backdrop = $('<div class="modal-backdrop ' + animate + '" />')
         .appendTo(this.$body)
 
-      this.$element.on('mousedown.dismiss.bs.modal', $.proxy(function (e) {
+      this.$element.on('click.dismiss.bs.modal', $.proxy(function (e) {
         if (e.target !== e.currentTarget) return
         this.options.backdrop == 'static'
           ? this.$element[0].focus.call(this.$element[0])
@@ -207,8 +207,7 @@
   }
 
   Modal.prototype.checkScrollbar = function () {
-    if (document.body.clientWidth >= window.innerWidth) return
-    this.scrollbarWidth = this.scrollbarWidth || this.measureScrollbar()
+    this.scrollbarWidth = this.measureScrollbar()
   }
 
   Modal.prototype.setScrollbar = function () {
@@ -221,6 +220,7 @@
   }
 
   Modal.prototype.measureScrollbar = function () { // thx walsh
+    if (document.body.clientWidth >= window.innerWidth) return 0
     var scrollDiv = document.createElement('div')
     scrollDiv.className = 'modal-scrollbar-measure'
     this.$body.append(scrollDiv)

js/popover.js

@@ -46,7 +46,7 @@
     var content = this.getContent()
 
     $tip.find('.popover-title')[this.options.html ? 'html' : 'text'](title)
-    $tip.find('.popover-content').empty()[ // we use append for html objects to maintain js events
+    $tip.find('.popover-content').children().detach().end()[ // we use append for html objects to maintain js events
       this.options.html ? (typeof content == 'string' ? 'html' : 'append') : 'text'
     ](content)
 

js/scrollspy.js

@@ -65,6 +65,7 @@
         return ($href
           && $href.length
           && $href.is(':visible')
+          && $el.is(':visible')
           && [[$href[offsetMethod]().top + offsetBase, href]]) || null
       })
       .sort(function (a, b) { return a[0] - b[0] })

js/tests/unit/alert.js

@@ -30,7 +30,7 @@ $(function () {
   })
 
   test('should fade element out on clicking .close', function () {
-    var alertHTML = '<div class="alert-message warning fade in">'
+    var alertHTML = '<div class="alert alert-danger fade in">'
         + '<a class="close" href="#" data-dismiss="alert">×</a>'
         + '<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>'
         + '</div>'
@@ -42,17 +42,17 @@ $(function () {
   })
 
   test('should remove element when clicking .close', function () {
-    var alertHTML = '<div class="alert-message warning fade in">'
+    var alertHTML = '<div class="alert alert-danger fade in">'
         + '<a class="close" href="#" data-dismiss="alert">×</a>'
         + '<p><strong>Holy guacamole!</strong> Best check yo self, you\'re not looking too good.</p>'
         + '</div>'
     var $alert = $(alertHTML).appendTo('#qunit-fixture').bootstrapAlert()
 
-    notEqual($('#qunit-fixture').find('.alert-message').length, 0, 'element added to dom')
+    notEqual($('#qunit-fixture').find('.alert').length, 0, 'element added to dom')
 
     $alert.find('.close').click()
 
-    equal($('#qunit-fixture').find('.alert-message').length, 0, 'element removed from dom')
+    equal($('#qunit-fixture').find('.alert').length, 0, 'element removed from dom')
   })
 
   test('should not fire closed when close is prevented', function () {

js/tests/unit/collapse.js

@@ -75,7 +75,7 @@ $(function () {
   test('should remove "collapsed" class from target when collapse is shown', function () {
     stop()
 
-    var $target = $('<a data-toggle="collapse" href="#test1"/>').appendTo('#qunit-fixture')
+    var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1"/>').appendTo('#qunit-fixture')
 
     $('<div id="test1"/>')
       .appendTo('#qunit-fixture')
@@ -102,6 +102,38 @@ $(function () {
     $target.click()
   })
 
+  test('should not close a collapse when initialized with "show" if already shown', function () {
+    stop()
+
+    expect(0)
+
+    var $test = $('<div id="test1" class="in"/>')
+      .appendTo('#qunit-fixture')
+      .on('hide.bs.collapse', function () {
+        ok(false)
+      })
+
+    $test.bootstrapCollapse('show')
+
+    setTimeout(start, 0)
+  })
+
+  test('should open a collapse when initialized with "show" if not already shown', function () {
+    stop()
+
+    expect(1)
+
+    var $test = $('<div id="test1" />')
+      .appendTo('#qunit-fixture')
+      .on('show.bs.collapse', function () {
+        ok(true)
+      })
+
+    $test.bootstrapCollapse('show')
+
+    setTimeout(start, 0)
+  })
+
   test('should remove "collapsed" class from active accordion target', function () {
     stop()
 
@@ -168,4 +200,67 @@ $(function () {
     $target3.click()
   })
 
+  test('should set aria-expanded="true" on target when collapse is shown', function () {
+    stop()
+
+    var $target = $('<a data-toggle="collapse" class="collapsed" href="#test1" aria-expanded="false"/>').appendTo('#qunit-fixture')
+
+    $('<div id="test1"/>')
+      .appendTo('#qunit-fixture')
+      .on('show.bs.collapse', function () {
+        equal($target.attr('aria-expanded'), 'true', 'aria-expanded on target is "true"')
+        start()
+      })
+
+    $target.click()
+  })
+
+  test('should set aria-expanded="false" on target when collapse is hidden', function () {
+    stop()
+
+    var $target = $('<a data-toggle="collapse" href="#test1" aria-expanded="true"/>').appendTo('#qunit-fixture')
+
+    $('<div id="test1" class="in"/>')
+      .appendTo('#qunit-fixture')
+      .on('hide.bs.collapse', function () {
+        equal($target.attr('aria-expanded'), 'false', 'aria-expanded on target is "false"')
+        start()
+      })
+
+    $target.click()
+  })
+
+  test('should change aria-expanded from active accordion target to "false" and set the newly active one to "true"', function () {
+    stop()
+
+    var accordionHTML = '<div id="accordion">'
+        + '<div class="accordion-group"/>'
+        + '<div class="accordion-group"/>'
+        + '<div class="accordion-group"/>'
+        + '</div>'
+    var $groups = $(accordionHTML).appendTo('#qunit-fixture').find('.accordion-group')
+
+    var $target1 = $('<a data-toggle="collapse" href="#body1" data-parent="#accordion"/>').appendTo($groups.eq(0))
+
+    $('<div id="body1" aria-expanded="true" class="in"/>').appendTo($groups.eq(0))
+
+    var $target2 = $('<a class="collapsed" data-toggle="collapse" href="#body2" data-parent="#accordion"/>').appendTo($groups.eq(1))
+
+    $('<div id="body2" aria-expanded="false"/>').appendTo($groups.eq(1))
+
+    var $target3 = $('<a class="collapsed" data-toggle="collapse" href="#body3" data-parent="#accordion"/>').appendTo($groups.eq(2))
+
+    $('<div id="body3" aria-expanded="false"/>')
+      .appendTo($groups.eq(2))
+      .on('show.bs.collapse', function () {
+        equal($target1.attr('aria-expanded'), 'false', 'inactive target 1 has aria-expanded="false"')
+        equal($target2.attr('aria-expanded'), 'false', 'inactive target 2 has aria-expanded="false"')
+        equal($target3.attr('aria-expanded'), 'true', 'active target 3 has aria-expanded="false"')
+
+        start()
+      })
+
+    $target3.click()
+  })
+
 })

js/tests/unit/modal.js

@@ -141,7 +141,7 @@ $(function () {
         notEqual($('#modal-test').length, 0, 'modal insterted into dom')
         $('.contents').click()
         ok($('#modal-test').is(':visible'), 'modal visible')
-        $('#modal-test').mousedown()
+        $('#modal-test').click()
       })
       .on('hidden.bs.modal', function () {
         ok(!$('#modal-test').is(':visible'), 'modal hidden')
@@ -196,7 +196,7 @@ $(function () {
     $('<div id="modal-test"><div class="contents"/></div>')
       .on('shown.bs.modal', function () {
         triggered = 0
-        $('#modal-test').mousedown()
+        $('#modal-test').click()
       })
       .on('hide.bs.modal', function () {
         triggered += 1

js/tests/unit/scrollspy.js

@@ -124,12 +124,12 @@ $(function () {
 
   test('should add the active class to the correct element', function () {
     var navbarHtml =
-        '<div class="navbar">'
+        '<nav class="navbar">'
       + '<ul class="nav">'
       + '<li id="li-1"><a href="#div-1">div 1</a></li>'
       + '<li id="li-2"><a href="#div-2">div 2</a></li>'
       + '</ul>'
-      + '</div>'
+      + '</nav>'
     var contentHtml =
         '<div class="content" style="overflow: auto; height: 50px">'
       + '<div id="div-1" style="height: 100px; padding: 0; margin: 0">div 1</div>'

js/tests/unit/tooltip.js

@@ -768,6 +768,8 @@ $(function () {
         var offset = $('.tooltip').offset()
         $styles.remove()
         ok(Math.abs(offset.left - 88) <= 1, 'tooltip has correct horizontal location')
+        $circle.bootstrapTooltip('hide')
+        equal($('.tooltip').length, 0, 'tooltip removed from dom')
         start()
       })
       .bootstrapTooltip({ container: 'body', placement: 'top', trigger: 'manual' })
@@ -775,4 +777,96 @@ $(function () {
     $circle.bootstrapTooltip('show')
   })
 
+  test('should not reload the tooltip on subsequent mouseenter events', function () {
+    var titleHtml = function () {
+      var uid = $.fn.bootstrapTooltip.Constructor.prototype.getUID('tooltip')
+      return '<p id="tt-content">' + uid + '</p><p>' + uid + '</p><p>' + uid + '</p>'
+    }
+
+    var $tooltip = $('<span id="tt-outer" rel="tooltip" data-trigger="hover" data-placement="top">some text</span>')
+      .appendTo('#qunit-fixture')
+
+    $tooltip.bootstrapTooltip({
+      html: true,
+      animation: false,
+      trigger: 'hover',
+      delay: { show: 0, hide: 500 },
+      container: $tooltip,
+      title: titleHtml
+    })
+
+    $('#tt-outer').trigger('mouseenter')
+
+    var currentUid = $('#tt-content').text()
+
+    $('#tt-content').trigger('mouseenter')
+    equal(currentUid, $('#tt-content').text())
+  })
+
+  test('should not reload the tooltip if the mouse leaves and re-enters before hiding', function () {
+    var titleHtml = function () {
+      var uid = $.fn.bootstrapTooltip.Constructor.prototype.getUID('tooltip')
+      return '<p id="tt-content">' + uid + '</p><p>' + uid + '</p><p>' + uid + '</p>'
+    }
+
+    var $tooltip = $('<span id="tt-outer" rel="tooltip" data-trigger="hover" data-placement="top">some text</span>')
+      .appendTo('#qunit-fixture')
+
+    $tooltip.bootstrapTooltip({
+      html: true,
+      animation: false,
+      trigger: 'hover',
+      delay: { show: 0, hide: 500 },
+      container: $tooltip,
+      title: titleHtml
+    })
+
+    var obj = $tooltip.data('bs.tooltip')
+
+    $('#tt-outer').trigger('mouseenter')
+
+    var currentUid = $('#tt-content').text()
+
+    $('#tt-outer').trigger('mouseleave')
+    equal(currentUid, $('#tt-content').text())
+
+    ok(obj.hoverState == 'out', 'the tooltip hoverState should be set to "out"')
+
+    $('#tt-content').trigger('mouseenter')
+    ok(obj.hoverState == 'in', 'the tooltip hoverState should be set to "in"')
+
+    equal(currentUid, $('#tt-content').text())
+  })
+
+  test('should position arrow correctly when tooltip is moved to not appear offscreen', function () {
+    stop()
+
+    var styles = '<style>'
+        + '.tooltip, .tooltip *, .tooltip *:before, .tooltip *:after { box-sizing: border-box; }'
+        + '.tooltip { position: absolute; }'
+        + '.tooltip-arrow { position: absolute; width: 0; height: 0; }'
+        + '.tooltip .tooltip-inner { max-width: 200px; padding: 3px 8px; }'
+        + '</style>'
+    var $styles = $(styles).appendTo('head')
+
+    $('<a href="#" title="tooltip title" style="position: absolute; bottom: 0; right: 0;">Foobar</a>')
+      .appendTo('body')
+      .on('shown.bs.tooltip', function () {
+        var arrowStyles = $(this).data('bs.tooltip').$tip.find('.tooltip-arrow').attr('style')
+        ok(/left/i.test(arrowStyles) && !/top/i.test(arrowStyles), 'arrow positioned correctly')
+        $(this).bootstrapTooltip('hide')
+      })
+      .on('hidden.bs.tooltip', function () {
+        $styles.remove()
+        $(this).remove()
+        start()
+      })
+      .bootstrapTooltip({
+        container: 'body',
+        placement: 'top',
+        trigger: 'manual'
+      })
+      .bootstrapTooltip('show')
+  })
+
 })

js/tests/vendor/qunit.css

 /*!
- * QUnit 1.14.0
+ * QUnit 1.15.0
  * http://qunitjs.com/
  *
- * Copyright 2013 jQuery Foundation and other contributors
+ * Copyright 2014 jQuery Foundation and other contributors
  * Released under the MIT license
  * http://jquery.org/license
  *
- * Date: 2014-01-31T16:40Z
+ * Date: 2014-08-08T16:00Z
  */
 
 /** Font Family and Sizes */
@@ -62,14 +62,14 @@
 }
 
 #qunit-testrunner-toolbar {
-	padding: 0.5em 0 0.5em 2em;
+	padding: 0.5em 1em 0.5em 1em;
 	color: #5E740B;
 	background-color: #EEE;
 	overflow: hidden;
 }
 
 #qunit-userAgent {
-	padding: 0.5em 0 0.5em 2.5em;
+	padding: 0.5em 1em 0.5em 1em;
 	background-color: #2B81AF;
 	color: #FFF;
 	text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px;
@@ -86,7 +86,7 @@
 }
 
 #qunit-tests li {
-	padding: 0.4em 0.5em 0.4em 2.5em;
+	padding: 0.4em 1em 0.4em 1em;
 	border-bottom: 1px solid #FFF;
 	list-style-position: inside;
 }
@@ -215,7 +215,7 @@
 /** Result */
 
 #qunit-testresult {
-	padding: 0.5em 0.5em 0.5em 2.5em;
+	padding: 0.5em 1em 0.5em 1em;
 
 	color: #2B81AF;
 	background-color: #D2E0E6;

js/tooltip.js

@@ -105,6 +105,11 @@
     var self = obj instanceof this.constructor ?
       obj : $(obj.currentTarget).data('bs.' + this.type)
 
+    if (self && self.$tip && self.$tip.is(':visible')) {
+      self.hoverState = 'in'
+      return
+    }
+
     if (!self) {
       self = new this.constructor(obj.currentTarget, this.getDelegateOptions())
       $(obj.currentTarget).data('bs.' + this.type, self)
@@ -147,7 +152,7 @@
     if (this.hasContent() && this.enabled) {
       this.$element.trigger(e)
 
-      var inDom = $.contains(document.documentElement, this.$element[0])
+      var inDom = $.contains(this.$element[0].ownerDocument.documentElement, this.$element[0])
       if (e.isDefaultPrevented() || !inDom) return
       var that = this
 
@@ -256,16 +261,18 @@
     if (delta.left) offset.left += delta.left
     else offset.top += delta.top
 
-    var arrowDelta          = delta.left ? delta.left * 2 - width + actualWidth : delta.top * 2 - height + actualHeight
-    var arrowPosition       = delta.left ? 'left'        : 'top'
-    var arrowOffsetPosition = delta.left ? 'offsetWidth' : 'offsetHeight'
+    var isVertical          = /top|bottom/.test(placement)
+    var arrowDelta          = isVertical ? delta.left * 2 - width + actualWidth : delta.top * 2 - height + actualHeight
+    var arrowOffsetPosition = isVertical ? 'offsetWidth' : 'offsetHeight'
 
     $tip.offset(offset)
-    this.replaceArrow(arrowDelta, $tip[0][arrowOffsetPosition], arrowPosition)
+    this.replaceArrow(arrowDelta, $tip[0][arrowOffsetPosition], isVertical)
   }
 
-  Tooltip.prototype.replaceArrow = function (delta, dimension, position) {
-    this.arrow().css(position, delta ? (50 * (1 - delta / dimension) + '%') : '')
+  Tooltip.prototype.replaceArrow = function (delta, dimension, isHorizontal) {
+    this.arrow()
+      .css(isHorizontal ? 'left' : 'top', 50 * (1 - delta / dimension) + '%')
+      .css(isHorizontal ? 'top' : 'left', '')
   }
 
   Tooltip.prototype.setContent = function () {
@@ -276,16 +283,17 @@
     $tip.removeClass('fade in top bottom left right')
   }
 
-  Tooltip.prototype.hide = function () {
+  Tooltip.prototype.hide = function (callback) {
     var that = this
     var $tip = this.tip()
     var e    = $.Event('hide.bs.' + this.type)
 
-    this.$element.removeAttr('aria-describedby')
-
     function complete() {
       if (that.hoverState != 'in') $tip.detach()
-      that.$element.trigger('hidden.bs.' + that.type)
+      that.$element
+        .removeAttr('aria-describedby')
+        .trigger('hidden.bs.' + that.type)
+      callback && callback()
     }
 
     this.$element.trigger(e)
@@ -323,7 +331,11 @@
     var isBody = el.tagName == 'BODY'
     var isSvg  = window.SVGElement && el instanceof window.SVGElement
 
-    var elRect    = el.getBoundingClientRect ? el.getBoundingClientRect() : null
+    var elRect    = el.getBoundingClientRect()
+    if (elRect.width == null) {
+      // width and height are missing in IE8, so compute them manually; see https://github.com/twbs/bootstrap/issues/14093
+      elRect = $.extend({}, elRect, { width: elRect.right - elRect.left, height: elRect.bottom - elRect.top })
+    }
     var elOffset  = isBody ? { top: 0, left: 0 } : $element.offset()
     var scroll    = { scroll: isBody ? document.documentElement.scrollTop || document.body.scrollTop : $element.scrollTop() }
     var outerDims = isSvg ? {} : {
@@ -395,14 +407,6 @@
     return (this.$arrow = this.$arrow || this.tip().find('.tooltip-arrow'))
   }
 
-  Tooltip.prototype.validate = function () {
-    if (!this.$element[0].parentNode) {
-      this.hide()
-      this.$element = null
-      this.options  = null
-    }
-  }
-
   Tooltip.prototype.enable = function () {
     this.enabled = true
   }
@@ -429,8 +433,11 @@
   }
 
   Tooltip.prototype.destroy = function () {
+    var that = this
     clearTimeout(this.timeout)
-    this.hide().$element.off('.' + this.type).removeData('bs.' + this.type)
+    this.hide(function () {
+      that.$element.off('.' + that.type).removeData('bs.' + that.type)
+    })
   }
 
 

less/_button-group.less

@@ -226,11 +226,14 @@
 // Checkbox and radio options
 //
 // In order to support the browser's form validation feedback, powered by the
-// `required` attribute, we have to "hide" the inputs via `opacity`. We cannot
-// use `display: none;` or `visibility: hidden;` as that also hides the popover.
+// `required` attribute, we have to "hide" the inputs via `clip`. We cannot use
+// `display: none;` or `visibility: hidden;` as that also hides the popover.
+// Simply visually hiding the inputs via `opacity` would leave them clickable in
+// certain cases which is prevented by using `clip` and `pointer-events`.
 // This way, we ensure a DOM element is visible to position the popover from.
 //
-// See https://github.com/twbs/bootstrap/pull/12794 for more.
+// See https://github.com/twbs/bootstrap/pull/12794 and
+// https://github.com/twbs/bootstrap/pull/14559 for more information.
 
 [data-toggle="buttons"] {
   > .btn,
@@ -238,8 +241,8 @@
     input[type="radio"],
     input[type="checkbox"] {
       position: absolute;
-      z-index: -1;
-      opacity: 0;
+      clip: rect(0,0,0,0);
+      pointer-events: none;
     }
   }
 }

less/_dropdown.less

@@ -96,9 +96,8 @@
   &:focus {
     color: @dropdown-link-disabled-color;
   }
-}
-// Nuke hover/focus effects
-.dropdown-menu > .disabled > a {
+
+  // Nuke hover/focus effects
   &:hover,
   &:focus {
     text-decoration: none;
@@ -205,4 +204,3 @@
     }
   }
 }
-

less/_forms.less

@@ -328,12 +328,12 @@ input[type="checkbox"] {
 
 .input-sm,
 .form-group-sm .form-control {
-  .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @border-radius-small);
+  .input-size(@input-height-small; @padding-small-vertical; @padding-small-horizontal; @font-size-small; @line-height-small; @input-border-radius-small);
 }
 
 .input-lg,
 .form-group-lg .form-control {
-  .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @border-radius-large);
+  .input-size(@input-height-large; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large; @input-border-radius-large);
 }
 
 

less/_jumbotron.less

@@ -4,7 +4,7 @@
 
 
 .jumbotron {
-  padding: @jumbotron-padding;
+  padding: @jumbotron-padding (@jumbotron-padding / 2);
   margin-bottom: @jumbotron-padding;
   color: @jumbotron-color;
   background-color: @jumbotron-bg;
@@ -18,7 +18,8 @@
     border-top-color: darken(@jumbotron-bg, 10%);
   }
 
-  .container & {
+  .container &,
+  .container-fluid & {
     .border-radius(@border-radius-large); // Only round corners at higher resolutions if contained in a container
   }
 
@@ -27,8 +28,7 @@
   }
 
   @media screen and (min-width: @screen-sm-min) {
-    padding-top:    (@jumbotron-padding * 1.6);
-    padding-bottom: (@jumbotron-padding * 1.6);
+    padding: (@jumbotron-padding * 1.6) 0;
 
     .container & {
       padding-left:  (@jumbotron-padding * 2);

less/_list-group.less

@@ -75,7 +75,7 @@ a.list-group-item {
     background-color: @list-group-disabled-bg;
     color: @list-group-disabled-color;
     cursor: not-allowed;
-    
+
     // Force color to inherit for custom content
     .list-group-item-heading {
       color: inherit;

less/_navbar.less

@@ -322,6 +322,10 @@
   .form-group {
     @media (max-width: @grid-float-breakpoint-max) {
       margin-bottom: 5px;
+
+      &:last-child {
+        margin-bottom: 0;
+      }
     }
   }
 

less/_pager.less

@@ -51,5 +51,4 @@
       cursor: not-allowed;
     }
   }
-
 }

less/_popover.less

@@ -11,7 +11,11 @@
   display: none;
   max-width: @popover-max-width;
   padding: 1px;
-  text-align: left; // Reset given new insertion method
+  // Reset font and text propertes given new insertion method
+  font-size: @font-size-base;
+  font-weight: normal;
+  line-height: @line-height-base;
+  text-align: left;
   background-color: @popover-bg;
   background-clip: padding-box;
   border: 1px solid @popover-border-color;
@@ -32,8 +36,6 @@
   margin: 0; // reset heading margin
   padding: 8px 14px;
   font-size: @font-size-base;
-  font-weight: normal;
-  line-height: 18px;
   background-color: @popover-title-bg;
   border-bottom: 1px solid darken(@popover-title-bg, 5%);
   border-radius: (@border-radius-large - 1) (@border-radius-large - 1) 0 0;
@@ -124,5 +126,4 @@
       bottom: -@popover-arrow-width;
     }
   }
-
 }

less/_print.less

 //
 // Basic print styles
 // --------------------------------------------------
-// Source: https://github.com/h5bp/html5-boilerplate/blob/master/css/main.css
+// Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css
 
 @media print {
-
   * {
-    text-shadow: none !important;
-    color: #000 !important; // Black prints faster: h5bp.com/s
     background: transparent !important;
+    color: #000 !important; // Black prints faster: h5bp.com/s
     box-shadow: none !important;
+    text-shadow: none !important;
   }
 
   a,
@@ -25,9 +24,10 @@
     content: " (" attr(title) ")";
   }
 
-  // Don't show links for images, or javascript/internal links
-  a[href^="javascript:"]:after,
-  a[href^="#"]:after {
+  // Don't show links that are fragment identifiers,
+  // or use the `javascript:` pseudo protocol
+  a[href^="#"]:after,
+  a[href^="javascript:"]:after {
     content: "";
   }
 
@@ -72,12 +72,6 @@
   .navbar {
     display: none;
   }
-  .table {
-    td,
-    th {
-      background-color: #fff !important;
-    }
-  }
   .btn,
   .dropup > .btn {
     > .caret {
@@ -90,6 +84,11 @@
 
   .table {
     border-collapse: collapse !important;
+
+    td,
+    th {
+      background-color: #fff !important;
+    }
   }
   .table-bordered {
     th,
@@ -97,5 +96,4 @@
       border: 1px solid #ddd !important;
     }
   }
-
 }

less/_variables.less

@@ -186,8 +186,15 @@
 @input-color:                    @gray;
 //** `<input>` border color
 @input-border:                   #ccc;
-//** `<input>` border radius
+
+// TODO: Rename `@input-border-radius` to `@input-border-radius-base` in v4
+//** Default `.form-control` border radius
 @input-border-radius:            @border-radius-base;
+//** Large `.form-control` border radius
+@input-border-radius-large:      @border-radius-large;
+//** Small `.form-control` border radius
+@input-border-radius-small:      @border-radius-small;
+
 //** Border color for inputs on focus
 @input-border-focus:             #66afe9;
 @input-box-shadow-focus:         rgba(102,175,233,.6);
@@ -348,7 +355,7 @@
 @navbar-inverse-border:                     darken(@navbar-inverse-bg, 10%);
 
 // Inverted navbar links
-@navbar-inverse-link-color:                 @gray-light;
+@navbar-inverse-link-color:                 lighten(@gray-light, 15%);
 @navbar-inverse-link-hover-color:           #fff;
 @navbar-inverse-link-hover-bg:              transparent;
 @navbar-inverse-link-active-color:          @navbar-inverse-link-hover-color;
@@ -378,8 +385,6 @@
 @nav-disabled-link-color:                   @gray-light;
 @nav-disabled-link-hover-color:             @gray-light;
 
-@nav-open-link-hover-color:                 #fff;
-
 //== Tabs
 @nav-tabs-border-color:                     #ddd;
 
@@ -504,7 +509,7 @@
 //** Popover arrow width
 @popover-arrow-width:                 10px;
 //** Popover arrow color
-@popover-arrow-color:                 #fff;
+@popover-arrow-color:                 @popover-bg;
 
 //** Popover outer arrow width
 @popover-arrow-outer-width:           (@popover-arrow-width + 1);
@@ -764,5 +769,3 @@
 @dl-horizontal-offset:        @component-offset-horizontal;
 //** Horizontal line color.
 @hr-border:                   @gray-lighter;
-
-

less/mixins/labels.less

@@ -2,7 +2,7 @@
 
 .label-variant(@color) {
   background-color: @color;
-  
+
   &[href] {
     &:hover,
     &:focus {

package.json

@@ -31,34 +31,33 @@
   },
   "devDependencies": {
     "btoa": "~1.1.2",
-    "glob": "~4.0.4",
+    "glob": "~4.0.5",
     "grunt": "~0.4.5",
-    "grunt-autoprefixer": "~0.8.2",
+    "grunt-autoprefixer": "~1.0.1",
     "grunt-banner": "~0.2.3",
     "grunt-contrib-clean": "~0.6.0",
     "grunt-contrib-concat": "~0.5.0",
     "grunt-contrib-connect": "~0.8.0",
     "grunt-contrib-copy": "~0.5.0",
-    "grunt-contrib-csslint": "~0.2.0",
+    "grunt-contrib-csslint": "~0.3.1",
     "grunt-contrib-cssmin": "~0.10.0",
     "grunt-contrib-jade": "~0.12.0",
     "grunt-contrib-jshint": "~0.10.0",
-    "grunt-contrib-less": "~0.11.3",
+    "grunt-contrib-less": "~0.11.4",
     "grunt-contrib-qunit": "~0.5.2",
-    "grunt-contrib-uglify": "~0.5.0",
+    "grunt-contrib-uglify": "~0.5.1",
     "grunt-contrib-watch": "~0.6.1",
     "grunt-csscomb": "~3.0.0",
     "grunt-exec": "~0.4.6",
     "grunt-html-validation": "~0.1.18",
     "grunt-jekyll": "~0.4.2",
-    "grunt-jscs": "~0.6.1",
-    "grunt-lesslint": "~0.17.0",
-    "grunt-saucelabs": "~8.2.0",
+    "grunt-jscs": "~0.7.1",
+    "grunt-saucelabs": "~8.3.2",
     "grunt-sed": "~0.1.1",
     "load-grunt-tasks": "~0.6.0",
     "markdown": "~0.5.0",
-    "npm-shrinkwrap": "~3.1.6",
-    "time-grunt": "~0.4.0"
+    "npm-shrinkwrap": "~3.1.8",
+    "time-grunt": "~1.0.0"
   },
   "engines": {
     "node": "~0.10.1"

test-infra/uncached-npm-install.sh

@@ -2,5 +2,14 @@
 set -e
 cd ..  # /bootstrap/
 cp test-infra/npm-shrinkwrap.json npm-shrinkwrap.json
-npm install
+# npm is flaky, so try multiple times
+MAXTRIES=3
+TRIES=1
+while ! npm install; do
+    if [ $TRIES -ge $MAXTRIES ]; then
+        exit 1
+    fi
+    TRIES=$(($TRIES + 1))
+    echo "Retrying npm install (Try $TRIES of $MAXTRIES)..."
+done
 rm npm-shrinkwrap.json