Our second beta has arrived for Bootstrap 5! We delayed its release to iron out some issues with third-party libraries and stabilize our major changes. We’ve also once again shipped some awesome updates to our documentation.
Next up is our final beta, which we may even promote to a stable release depending on how development proceeds. Stay tuned for that!
Dropdowns saw a lot of work in Beta 2 because of how much has
for most dropdown, popover, and toolip positioning). We’ve modified
our dropdown plugin to add a new data attribute to help separate
our own positioning styles with that of Popper’s. The issues we
overlapping a button or an incorrect responsive
class—were largely the result of competing positioning.
Now when dropdown menus have
dropdowns are in our navbars, their menus will have
added. This separates two different positioning libraries, ours and
Poppers, and ensures all behaviors are supported. You can see
all the options in a new example in our docs.
We updated our CSS selectors to use these new data attributes,
In addition, we’ve removed the initial
dropdowns and popovers, instead of relying on Popper’s offsets.
These also conflicted with the default styling for elements
positioned by Popper.js. Relatedly, there was a bug in how popover
arrows were aligned that has now been resolved.
Color utility docs
We’ve overhauled our color utility documentation, separating the
color classes from
ones. We’ve also made extensive use of our
to include tons more code snippets in our docs.
Both pages now include a new Sass section, showing relevant snippets of our source code that are related to each set of utilities. We list all our available color variables, our theme color variables and maps, associated mixins and loops, and even where these utilities are generated in the utilities API.
Expect this kind of documentation improvements to continue into our next release. Follow along in the draft pull request that adds Sass docs to all our components on GitHub.
- Dropdown now emits events on the
.dropdown-toggleinstead of the
- Restored the offset option for dropdowns.
- Fixed modal toggling when clicking on
- We now build our base component as a separate
- We now prevent
getSelectorfrom returning URLs as selector which caused errors in dropdown and scrollspy plugins.
- Refactored components to use a utility function to define jQuery plugins
Across the board, we’ve made a few small changes to other components that are worth a brief mention here.
.navbar-nav-scrollclass to enable vertical scrolling when a collapsed navbar is opened. It’s customizable via Sass and a CSS variable. Read more in the docs. We’ve re-added
.navbar-collapseto restore the flexbox behaviors from v4 and prevent some content from being inadvertently squished.
.form-selectForm validation mixin updated with additional parameters Fixed validation icon placement in
.form-selectCheckboxes and radio buttons are aligned better in input groups
.toast-bodyAdded a live example to the docs to trigger a real toast
<button>s wherever possible instead of
<a>elements. CSS selectors changed for using
<button>s as indicators (from
Head to https://getbootstrap.com to explore the new release. We’ve also published this updated as a pre-release to npm, so if you’re feeling bold or are curious about what’s new, you can pull the latest in that way.
npm i bootstrap@next
We have three releases coming up next for the team:
- Bootstrap v5.0.0-beta3 (possibly promoted to v5 stable)
- Bootstrap v4.6.1 (bringing in some more bugfixes and alignment with the latest in v5)
- Bootstrap Icons v1.4.0