@mdo mdo released this Apr 30, 2018 · 43 commits to v4-dev since this release

Our first patch release for Bootstrap 4! Here's a quick rundown of some of the changes:

  • Added validation styles for file inputs
  • Improved printing of dark tables
  • Suppressed that text-hide deprecation notice by default
  • Cleaned up some JS globals and improve coverage
  • Bumped dependencies, namely Jekyll
  • Fixed docs issue with incorrect name for our monospace font utility

Checkout the v4.1.1 ship list and GitHub project for the full details.


@mdo mdo released this Apr 9, 2018 · 79 commits to v4-dev since this release

  • Added new custom range form control.
  • Added new .carousel-fade modifier to switch carousel from horizontal sliding to crossfade.
  • Added new .dropdown-item-text for plaintext dropdown items.
  • Added new .flex-fill, .flex-grow-*, and .flex-shrink-* utilities.
  • Added new .table-borderless variant for tables.
  • Added new .text-monospace utility.
  • Added new .text-body (default body color), .text-black-50 (50% opacity black), and .text-white-50 (50% opacity white) utilities.
  • Added new .shadow-* utilities for quickly adding box-shadows.
  • Added ability to disable Popper's positioning in dropdowns.
  • Fixed longstanding issue with Chrome incorrectly rendering cards across CSS columns.
  • Deprecated .text-hide—you'll see a warning during compilation—as it's a dated and undocumented feature.
  • Fixed up Dashboard and Offcanvas examples across Firefox and IE.
  • Breadcrumbs can now use non-string values as dividers.
  • Updated our Theming docs to confirm you cannot use CSS variables in media queries (sorry folks!).

Be sure to look at the ship list and project board for more details on all our fixes.


@mdo mdo released this Jan 18, 2018 · 248 commits to v4-dev since this release

Our first stable v4 release! 🎉


  • Brand new examples and overhauls for existing ones.
  • Additional border utilities have been added and the default border-color for them darkened from $gray-200 to $gray-300.
  • Pagination focus styles now match button and input focus state.
  • Added responsive .order-0 classes to reset column order.
  • Improved examples of form validation documentation by adding tooltip examples and more.
  • New documentation added for using our CSS variables to the Theming page.
  • Improved consistent across browsers when printing.
  • Sass map extends and docs
  • New and improved print display utilities

Project board

For more details, visit #25098.


@mdo mdo released this Dec 28, 2017 · 363 commits to v4-dev since this release

Breaking changes

As mentioned in our Beta 2 release, we needed to make a few more breaking changes in Beta 3. We've summarized them here and in our migration docs—be sure to read them!

  • Rewrote native and custom check controls. Both browser default and custom checkboxes and radios now have simpler markup after removing the <input> from the <label>. Now, all checkboxes and radios have a parent <div> and sibling <input> and <label> pair. This is essential for form validation and disabled inputs because we can use the input's state to style the label.

    In addition, custom checkbox and radio elements no longer have a .custom-control-indicator. This is generated from the new .custom-control-label.

  • Input groups were rewritten with specific .input-group-{prepend|append} classes. The new approach allows us to support validation styles and messages within input groups, while also adding support for custom selects, custom file inputs, and multiple .form-controls.

  • Responsive tables are once again parent classes to avoid accessiblity issues with changing a <table>'s display.

  • Deleted the .col-form-legend class, consolidating it's styles into the .col-form-label class.

Read the Migration page for further details.

More highlights

In addition to the breaking changes, we've addressed a few more general issues that may impact your project.

  • Restored cursor: pointer to non-disabled links, buttons, .close, navbar toggler, and pagination links.

  • Added a new vertically centered modal option with .modal-dialog-centered.

  • Added new dropleft and dropright variants for dropdowns in #23860.

  • Our npm package no longer includes any files other than our source and dist JavaScript and CSS files. If you previously relied on our running our scripts via the node_modules folder, you'll need to update your build tools.

  • Print styles have moved to bottom of the import stack to properly override styles.

For more details on this release's changes, take a look at the Beta 3 ship list issue, as well as the Beta 3 project.


@mdo mdo released this Oct 19, 2017 · 644 commits to v4-dev since this release

Beta 2 is here! Read the full ship list for details on what issues were closed and PRs merged.


  • Improved Sass map customization with #23260. With this change, it's now possible to override specific key value pairs instead of resetting the entire map, ideal for color scheme customization.
  • Restored grid .offset- modifiers in #23445. Originally our intent was to supplement this with our margin utilities, but we underestimated the appeal of fixed number column offsets.
  • Remove unnecessary color from .badge, and it's associated $badge-color variable, in #23529.
  • Rename grayscale function to gray to avoid breaking CSS native grayscale filter in #23579.
  • Renamed .table-inverse, .thead-inverse, and .thead-default to .*-dark and .*-light, matching our color schemes used elsewhere in #23560.
  • Responsive tables now generate classes for each grid breakpoint, meaning we've added .table-responsive-{sm,md,lg,xl} to the already present .table-responsive. You might need to adjust your usage depending on when you want a table to resize. See #22804.
  • Include two new dist files which contain Popper.js inside bootstrap.bundle.js and bootstrap.bundle.min.js. See #23735.
  • Dropped support for Bower as they've deprecated the package manager. See #23568.
  • Switched breadcrumbs from float to flexbox in #23683.
  • Added new CSS variables in #23761.
  • Switched to Stylelint in #23572.
  • New Theming page in the docs from #23611
  • #23943: Changed the color-yiq from a mixin that included the color property to a function that returns a value, allowing you to use it for any CSS property. For example, instead of color-yiq(#000), you'd write color: color-yiq(#000);.
  • New and improved theming in #24429.


@mdo mdo released this Aug 11, 2017 · 1205 commits to v4-dev since this release

It's a beta! Holy crap this took forever. Thanks for sticking with me on this one—means a lot, y'all <3.


  • Dropped Normalize.css as a dependency, forking some of it and remixing it with our own Reboot for a more stable normalization approach.
  • Update navbar responsive behaviors to be mobile first, use a new class name .navbar-expand instead of .navbar-toggleable, remove toggler position modifiers (relies on flex utils now), and fix a handful of bugs.
  • Stabilize some grid behaviors and update the docs.
  • Updated the grid to drop push, pull, and offset in favor of new .order- modifiers and margin utilities.
  • Renamed tons of variables (see #22414 and #22092) for a more consistent naming scheme.
  • Removed remaining cursor: pointers to restore browser defaults and better indicate actions vs hyperlinks.
  • Renamed flexbox order utilities to better match utility naming scheme of .property-value.
  • Restored Alpha 5's placement of _custom.scss in our import order.
  • Rewrote display and responsive utilities to de-dupe a bunch of functionality.
  • Removed Gruntfile and docs from package manager builds.
  • Overhauled our color system with new Sass maps, variables, classes, and component variants.
  • Updated browser support to bring ranges up to more recent versions.
  • Added a bash script for linting unused variables.
  • Moved jQuery and Popper to peerDependencies as they're not requirements for every part of Bootstrap.

Be sure to read the full ship list.


@mdo mdo released this Jan 6, 2017 · 2033 commits to v4-dev since this release

Happy New Year! It's our final alpha for Bootstrap 4.



  • Flexbox is now on by default, with no fallback! This means we've dropped IE9 support, but with significant savings to our code base, simpler components, and improved customization thanks to the power of flexbox.
  • Rebuilt the navbar with flexbox in mind, leading to some structural changes, but including more flexibility and customization. Includes updated docs, code snippets, more responsive options. All navbars in our examples are also using the latest markup and styles now. Also solves around 10 bugs in the process!
  • Overhauled flexbox utilities and documented them. Replaced all the previous flexbox utilities with new ones that are named after property: value pairs (instead of creating new names for things). For example, .flex-items-between is now .justify-content-between to apply justify-content: between;. This also adds tons of new flexbox utilities for display, order, wrap, and more.
  • Revamped navs Sass with flexbox and updated docs. All the floats and clearfixs have been removed, .nav-inline removed (on account of display: flex inlining for us on .nav), added fill and justify options, and more.
  • Building on the grid improvements from Alpha 5, you can now customize container padding across grid breakpoints and optionally remove grid gutters with .no-gutters.
  • Similarly, our flexbox grid system has new classes for automatically sizing columns to the size of their content across viewports (e.g., you can now apply col-xs-6, col-md-auto, and col-xl-4 to a single element).
  • Grid, display, float, margin, padding, and text utility classes have been significantly overhauled. In addition to all classes now being responsive, the xs tier no longer requires a breakpoint abbreviation, making for shorter and more descriptive classes and an easier migration from v3. For example, instead of .d-xs-none, it's back to .d-none while it remains .d-{sm,md,lg,xl}-none for those breakpoints.
  • Renamed some .active, all .in, and all .open classes for our JavaScript powered components for more consistent naming. For example, instead it's now .collapse.show instead of .collapse.in and .show > .dropdown-menu instead of .open > .dropdown-menu to better communicate the visibility of elements.
  • Refactored carousel with new, simpler styles, better documentation, and less specific selectors.
  • Rewrote progress component without the <progress> element due to lack of animations, no support for multiple bars, and no support for labels on the progress bars.
  • Fixed some unescaped #s in our SVG data URLs that are used to add vector background-images.
  • Renamed .tag back to .badge, like v3, to avoid conflicts with common WordPress styles.
  • A number of custom form enhancements and bugfixes were made. Label-less custom radios and cehckboxes, fixed SVG URLs in background-images, and more.
  • Updated Normalize.css to v5.0.0.
  • .form-check and .form-check-inline now share the same markup. Switch between the two by adding or removing .form-check-inline as a modifier.
  • Added support for justified navigation when in flexbox mode.
  • Renamed _animation.scss to _transitions.scss for clarity.
  • Added new color variables (e.g., $blue) for additional customization.


@mdo mdo released this Oct 19, 2016 · 2732 commits to v4-dev since this release

Fifth alpha! View the milestone for details: #20630.


@mdo mdo released this Sep 5, 2016 · 2948 commits to v4-dev since this release

Fourth alpha release!

See the closed milestone for details.


@mdo mdo released this Jul 27, 2016 · 3011 commits to v4-dev since this release

Third alpha release!

See the closed milestone for details.