v3.2.0
Be sure to read the blog post for the highlights.
New features
- #12042: Responsive embeds, as seen in SUIT CSS.
- #12204: Visibility and hidden classes for
block
,inline-block
, andinline
elements. - #12690: Added ZeroClipboard to provide a Flash-based copy button on all examples to quickly copy snippets of code.
CSS
Misc
- #12679: Add
.sr-only-focusable
class to provide a focus state for skip nav links. - #13194: Update Normalize to v3.0.1.
- #13649: Add
translate3d
in a few instances to reduce repainting when scrolling. - #13737: Reset the
html
font-size
using pixels instead of percentages.
Mixins
- #12459: Refactor scale mixins to ensure both
.scale(x)
and.scale(x, y)
work. - #12855: Add
.animation-fill-mode()
mixin. - #12993: Add a table of contents to
mixins.less
and reorganize things. - #12998: Modularized the mixins into separate files. We now have a
mixins
directory in ourless
folder that@import
s all the mixins intomixins.less
(for backward compatibility). - #13859: Update the
.skew()
mixin to useskewX(...) skewY(...)
instead of old and deprecatedskew(x,y)
syntax.
Grid system
- #12854, #12863: Properly reset
left
values toauto
instead of0
in.col-*-push-0
and.col-*-pull-0
grid reset classes. - #13616: Add custom grid gutter support to
.container-fixed()
..make-row
and.make-*-col
mixins already had this ability, so this simply completes the package.
Images
- #10073: Add
width: 100% \9;
to.img-responsive
to prevent IE10 and below from distorting<svg>
elements.
Typography
- #12753, #12756: Ensure the
.clearfix
is applied on.dl-horizontal dd
by moving it out of the media query (Less doesn't respect:extend()
within media queries). - #13449: Increase
.lead
font-weight
for better readability on mobile. - #13671: Add
text-transform
utility classes. - #13854: Darken
@gray-light
and.lead
to meet accessibility guidelines. - #13860: Add a new variable for
.dl-horizontal
's offset.
Code
- #12824: Remove
white-space: nowrap
from<code>
elements in favor of defaultpre-wrap
value for better rendering on narrow viewports. - #13351: Add support for nested
kbd
elements.
Tables
- #12722: Scope
.table-responsive
styles toscreen
devices only so they're not cut off when printing from Chrome (Safari is fine, unknown for IE and FF). - #12742: Make
.table-responsive
more mixin-friendly. - #13013: Ensure table cells with contextual states preserve their styles when used within a hover table.
- #13375: Remove bottom margin on tables within collapsible panels.
- #13670: Use
overflow-x: auto;
in responsive tables to hide the scrollbar when it's not needed. - #13707: Remove unnecessary
max-width: 100%;
on<table>
s and place it on.table
s.
Forms
- #12669: Properly reset
line-height
on all date inputs to ensure Mobile Safari and IE8+ display them correctly. - #12759: Make input groups in inline forms use
display: table-cell
so they are sized properly and appear on the same line as intended. - #12794: Fix placement of browser-based form validation popovers for
required
attribute. Applies to Firefox and Chrome. - #12801: Add padding to the bottom of
.form-control-static
to match height of standard form controls. - #12843: Scope label styles for horizontal forms to a media query so their narrow viewport display looks just like a normal form.
- #12868: Vertically center form feedback icons for large and small inputs. Also reorders our
bootstrap.less
file to placeglyphicons.less
closer to the top of our imports to avoid specificity issues. - #13003: Move
padding
on.radio
s and.checkbox
s to their immediate<label>
s to avoid the no-click deadzone caused by negative margin. - #13066: Add
z-index
to the form control feedback icons so input groups don't render on top of them. - #13099: Fix vertical alignment for all time-based inputs on iOS.
- #13141: Add a
max-width: 100%;
to<label>
elements so IE8 wraps text properly. - #13320: Fix
.form-control-feedback
position when labels have the.sr-only
class applied. This makes it super easy to use optional feedback icons with no visible label. - #13548: Use
position: absolute;
and an IE8-9 hack to fix checkbox and radioline-height
problems (and the vertical alignment) that were introduced after #13003. - #13651: Update explanatory comment about iOS date/time inputs bug.
- #13745: Add optional
.disabled
class to set not-allowed cursor on disabled radio and checkbox labels. - #13856: Add
.form-group-sm
and.form-group-lg
. - #13872: Always apply padding to
.form-control-static
for proper vertical alignment.
Buttons
- #12937: Darken active button background colors just a bit.
- #13079: Scope
.open
button state in.button-variant()
mixin to immediate children. - #13549: Use
.opacity()
mixin on button group inputs for IE8 support. - #13903: Restore side padding on
.btn-block
.
Panels
- #12683: Remove the
overflow: hidden;
from.panel-group > .panel
because it apparently serves no purpose and cuts off nested dropdown menus. - #12745: Add
@panel-heading-padding
and@panel-footer-padding
variables for panels. - #12822: Scope panel collapse styles to immediate
.panel-body
s only. - #13689: Fix double border in panel when a list group is followed by panel footer.
- #13735: Fix bug where a panel recieve extra top border when placed within a collapsible panel.
List groups
- #12490: Add support for disabled list items in list groups.
- #12739: Add
@list-group-link-hover-color
variable to customize the text color when hovering on linked list items. - #13857: Properly color
<small>
/.small
within active list group headings.
Progress bars
- #12848: Improve progress bars to better handle low to zero percentage values.
- #13861: Refactor striped and animated striped progress bars to deprecate the required parent class and add new modifier classes.
Badges
Navbar
- #12738: Revamps navbar collapse functionality. Instead of setting a
max-height
on all.navbar-collapse
elements, we only apply it to fixed top and bottom navbars. Also adds a shortermax-height
for landscape views to ensure scrolling still works. - #12694, #12813: Correctly reset
.btn-link
colors in a navbars.
Dropdowns
- #13037: Add
text-align: left;
to.dropdown-menu
to avoid inheritance from any parent that might reset that property (e.g., our.modal-footer
). - #13369: Fix dropdown menu alignment in justified button groups in Firefox.
- #13851: Add
white-space: nowrap;
to.dropdown-header
to match dropdown links.
Tooltips and popovers
- #12934, #12952: Base rounded corners on popover titles on the
@border-radius-large
variable. - #13216, #13217: Increase
z-index
values on tooltips and popovers to always be in front of modals.
Modals
- #12803: Removed unnecessary top margin from
.modal-footer
. All spacing is addressed bypadding
on the.modal-body
, and the.modal-header
never had anymargin
on it. - 7e551ec: Update padding on modals to be
15px
all around. Previously was15px
in the header and20px
everywhere else. - #13609: Update modal CSS to prevent shifting before animation.
Collapse
- #12593: Add support to Collapse plugin for
tr
s andtbody
s.
Carousel
- #13242: Fix horizontal alignment of carousel controls by using appropriate margin for each side.
Theme
- #13093: Reset the
background-color
andbackground-image
on disabled theme buttons.
Glyphicons
- #13542: Fixes #13478 by reverting #10941. This undoes the hardcoded some URL escaping around our icon paths as a way to fix broken assets when Bootstrap was included via Bower. Instead, folks implementing Bootstrap via Bower should use the relative URLs feature of Less.
JavaScript
Misc
- #11464: Improve the JavaScript
noConflict()
mode not working in 3.0.x. - #11966: Fix
.noConflict()
mode. - #12948: Use quotes around all element attribute values in selectors.
Dropdowns
- #11281: When opening a dropdown, focus the toggle before (instead of after) triggering the
shown
event. - #13296, #13354: Don't let dropdown menus disappear with right-click in Firefox.
Buttons
- #13511: Fix button plugin to allow empty string as reset state.
Scrollspy
- #11453: Fix scrollspy for targets within tabs.
- #11937: Correctly determine
scrollheight
of<body>
in IE10 and lower. - #12337: Correct some internal event names in scrollspy plugin.
- #13220: Correct scrollspy offsets when
scrollheight
changes. - #13589: Adjust for Scrollspy offset when calculating
maxScroll
. - #13702: Minor scrollspy refactoring.
Modals
- #11958: Move Modal
removeBackdrop()
call fromhideModal()
intobackdrop()
. - #12761: Remove
.focus()
event aliases from modal and dropdown plugins. - #12850: Stop passing argument of incorrect type to
Modal.hide()
- #13103: Stop modals from shifting
<body>
content to the left. - #13615: Add missing event namespacing in
modal.js
. - #13627: Fix restoration of focus to the triggering element upon dismissal of a modal.
Alerts
- #13406: Fire
closed.bs.alert
event after (instead of before) alert has been detached from the DOM.
Affix
- #9342, #12982: Properly reset affix position when scrolling back to top.
- #12862: Improve flickering and simplify calculations in affix plugin.
- #13342: Add a
target
option to the Affix plugin. - #13541: Improve affix plugin's
affix-bottom
positioning.
Tooltips and popovers
- #12328: Add tooltip
viewport
option, respect bounds of the viewport. - #12377: Stop using
document.body.scrollTop
, because it's deprecated. - #13060, #13481: Add
role="tooltip"
to tooltips & popovers by default to improve accessibility. - #13165: Fix popover when using
append
. - #13557: Add
aria-describedby
attribute to tooltips and popovers to improve accessibility - #13593: Add reference to triggering element to tooltip/popover element's data.
- #13752: Avoid error when trying to show an auto-placed tooltip that gets removed from the DOM.
Carousel
- #9461, #13173: Make carousel ignore content that's not an
.item
. - #12592: Change carousel indicators behavior to immediately move active classes from one indicator to the next.
- #13396: Add
direction
&relatedTarget
properties toslid.bs.carousel
event. - #13787: Add left and right keyboard support to the carousel.
Collapse
- #9836, #12983: Prevent collapse animation from jumping when an input holds focus.
- #11099: Prevent
$.collapse()
from overriding original dimensions of the collapsed element when uncollapsing. - #13157, #13176: Fix issues with transition end event bubbling in the collapse plugin.
- #13306: Don't override the original height/width of a collapsed element when uncollapsing it.
- #13330: Wait for the transition of the expected target to complete during a collapse.
Docs
- #12487: Document required use of
position: relative;
for Scrollspy plugin. - #12697: Document support for
input[readonly]
. - #12744: Document ability to remove animation on modals.
- #12790: Add link to unofficial Italian translation (http://hackerstribe.com/guide/IT-bootstrap-3.1.1/).
- #12808: Correct grid column values listed in Grid Options.
- #12810: Document
.container-fluid
in the CSS overview docs. - #12818: Small
table
tweak to browser support table. - #12866: Add
sitemap.xml
androbots.txt
files. - #12748, #12956: Document missing examples for common inline typography tags.
- #12688: Document ability to dismiss popover via focus and next click.
- #13024: Add
role="alert"
to alert examples to improve accessibility. - #13026: Document more Bootstrap components in the Theme and RTL examples.
- #13095: Generate translations list from YAML
_data
file. - #13167: Use underscore prefix to ignore certain directories.
- #13184: Document the
template
option of tooltip & popover plugins. - #13190: Document that a function for Popover's
content
parameter is called with the element as an argument. - #13222: Explicitly document how to change the mobile navbar breakpoint.
- #13332: Document specificity collisions of well backgrounds and contextual background classes.
- #13337: Mention removal of
.progress-*
contextual classes in the migration guide. - #13340: Document default assumption about icon font's location (and how to change it).
- #13362: Document that you shouldn't
show()
tooltips and popovers on hidden elements. - #13367: Update gradient mixin docs to use percentage values instead of decimals for color stops.
- #13396: Document
direction
&relatedTarget
properties of Carousel events. - #13397: Document that invisible (non-jQuery-
:visible
) scrollspy targets are ignored. - #13422: Warn about browsing the docs in IE when using an emulation mode to simulate older IE versions; these emulation modes can behave significantly differently than actual older IE versions.
- #13434: Explicitly document grid column wrapping behavior better.
- #13463: Add optional theme preview toggle to the docs sidebar on certain pages.
- #13493: Improve accessibility of
.close
buttons in docs examples. - #13495: Mark Android Firefox (Fennec) as an officially supported OS+browser combination.
- #13700: Add missing
role="menu"
attrs to.dropdown-menu
s. - #13768: Simpler and updated docs copy for icon font file paths given escaped path reversion.
Customizer
- #9951, #12865, #13205: Add Gist and Customizer URLs to customized files and
config.json
. - #10632: Show an alert with links when customizer config is successfully saved as Gist
- #12617, #12666: Show proper browser support errors for the Customizer.
- #12773: Add feature detection to block Safari, since it doesn't fully support the necessary Blob API.
- #12719, #12875: Update to Less 1.7.x.
- #12966: Ensure icon font vars are loaded into Customizer.
- #13373: Make variable deprecation notices visible in the Customizer.
- #13151: Update the Customizer to use to UglifyJS 2.
- #13472: Disabled the v2.x customizer.
- #13543: Customizer: make
utilities.less
inclusion mandatory - #13626: Show proper error message when viewing the Customizer in IE8
Examples
- #12735: Fix sidebar hover state in Dashboard example.
- #12894: Remove
margin-bottom
from last<p>
of.blog-footer
in the Blog example. - #12897: Remove
border-bottom
from navbar in Dashboard example for easier customization of navbar content. - #13390: Add IE10 viewport bug workaround to examples.
- #13905: Update the Cover example to move the
box-shadow
from the<body>
to the.site-wrapper
so it surrounds content of all lengths.
Build system
- #12670: Drop use of vendor prefix mixins and use autoprefixer as part of our Gruntfile. Mixins are still available and supported.
- #12672: Add logging to
build-raw-files
Grunt task. - #12760: Misc Grunt improvements.
- #12798: Updated QUnit test reporting so Sauce Labs can report exact failing tests.
- #12949: Switch to grunt-css-flip Grunt plugin for RTL CSS generation.
- #12829:
package.json
cleanup. - #12834: Update Sauce Labs config to use new name for Chrome browser for tests.
- #12853: Switch to JSCS to prepare for removal of style changes coming in JSHint 3.
- #12861: Add
docs.css
to the CSSComb task. - #12989: Don't ignore every dot file in Bower installs, only the ones in the root directory.
- #13064: Add
description
field tobower.json
- #13065: Exclude
/test-infra/
from Bower installs. - #13328: Include a reference to
bootstrap.less
in Bower for easier installs. - #13587: Switch to Kramdown for Jekyll.
- #13740: Add
replace
entry tocomposer.json
. - #13877: Switch to uber/npm-shrinkwrap for
npm-shrinkwrap.json
generation
Browser bugs
We've started tracking unresolved browser bugs that currently impact Bootstrap's development in some way. We call it the Wall of browser bugs. We've also documented a few new bugs with this release:
- #10690: Reported a bug in Firefox for responsive images (those with
max-width: 100%
) in table cells. No other browsers are affected. See https://bugzilla.mozilla.org/show_bug.cgi?id=975632. Until a fix is shipped, addwidth: 100%;
to your responsive images in table cells. - #12548: Reported a bug in Chrome where date inputs stop resizing when appearing with
display: table-cell;
. See https://code.google.com/p/chromium/issues/detail?id=346051. - #12476: Document IE8's limitation of borders on buttons in a justified button group. Currently the only way to get borders on those buttons is to wrap each button in an additional
.btn-group
, just like the button groups using<button>
elements.