How to upgrade Bootstrap 4 alpha 6 to Bootstrap 4 beta

After two years in the making, Bootstrap creators finally released first beta of Bootstrap 4. In latest version of Bootstrap 4 more then 650 files was changed, 67k lines was added, and 82k lines was deleted.

Following CSS classes was changed in Bootstrap 4 beta

{:.table.table-striped} Bootstrap 4 alpha 6 | Bootstrap 4 beta — | — .badge-default | .badge-dark .bg-faded | .bg-light .bg-inverse | .bg-dark .card-block | .card-body .card-block | .card-body .card-outline-* | .border-* .card-outline-primary | .border-primary .card-outline-secondary | .border-secondary .card-outline-success | .border-success .card-outline-info | .border-info .card-outline-warning | .border-warning .card-(color) | .bg-(color) .card-primary | .bg-primary .card-success | .bg-success .card-info | .bg-info .card-warning | .bg-warning .card-danger | .bg-danger .hidden-xs-down | .d-none .d-sm-block .hidden-sm-down | .d-none .d-md-block .hidden-md-down | .d-none .d-lg-block .hidden-lg-down | .d-none .d-xl-block .hidden-xs-up | .d-none .hidden-sm-up | .d-sm-none .hidden-md-up | .d-md-none .hidden-lg-up | .d-lg-none .hidden-xl-up | .d-xl-none .navbar-toggleable-* | .navbar-expand-* .navbar-toggleable-sm | .navbar-expand-sm .navbar-toggleable-md | .navbar-expand-md .navbar-toggleable-lg | .navbar-expand-lg

Improved auto-placement of tooltips, popovers, and dropdowns

Bootstrap 4 no longer uses Tether.js. This library was replaced by library called Popper.js

Subscribe to our newsletter
Get early information about new products, product updates and blog posts.