
What’s inside the new Bootstrap 4?
Everyone has used Bootstrap at least once in their projects and it’s no surprise, because Bootstrap is really simple and incredibly time-saving. It enables us to design responsive websites with less pain and features components that can be easily implemented: modals, tooltips, tabs, dropdown lists, buttons, and a lot more. The upcoming Bootstrap 4 is by now in an alpha release, so it’s not completely stable and some features may be changed.
Here are some new features you need to know before migrating to Bootstrap 4:
Type
The primary CSS unit is switched from px
to rem
, which means that font sizes are now related to the root element instead of pixels, and the global font-size is increased to 16px (14px in v3). V4 also includes new large display headings to make titles stand out.
Browser support and flexbox

LESS to SASS
New spacing utility classes
.m-t-md
, which stands for ‘margin top medium’ .The basic pattern for using spacing classes is
{property}{sides}-{breakpoint}-{size}
New responsive breakpoints
- Extra-small (<544 px)
- Small (≥544 px)
- Medium (≥768 px)
- Large (≥992 px)
- Extra-large (≥1200 px)
Cards are replacing wells and panels
Fresh look
The most important thing
Some links that might be useful: