Bootstrap 4 – List of Some New Features
Sass over LESS
Bootstrap developers were using LESS as their main CSS preprocessor till now. But in Bootstrap 4, LESS has been replaced with Sass. This is more popular among the frontend developers. It has a massive contributor base which is easier to use and gives more potentials. Here, we would also like to mention the name of Libsass Sass Complier which is written in C/C++. This has made Bootstrap 4 compiling things faster than before.
Screen Size Based Grid Tier
Till Bootstrap 3, there are 4 grid classes for columns. These 4 are –
a) .col-xs-XX for mobile phones
b) .col-sm-XX for tablets
c) .col-md-XX for desktops
d) .col-lg-XX for larger desktops
Bootstrap 4 has come up with the 5th option to target even more small devices which are less than 480px viewport width. With the introduction of this new grid class, the naming system has been pushed upwards by one notch. This new class has been given the name of the previous smallest one.
Relative CSS Units Introduction
Supporting the Internet Explorer 8 would not be found in Bootstrap 4. The main reason for doing this is to get rid of irritating polyfills and converting to relative CSS units. In Bootstrap 4, use of REMs and EMs would be preferred as compared to the pixels.
The team of expert web developers has combined some previous elements of Bootstrap’s UI. This resulted in the introduction of a new interface named as Cards in Bootstrap 4. This would be a better replacement of the earlier wells, thumbnails and panels. But the elements like titles, headers and footer of wells, thumbnails and panels would keep continuing.
New Reboot Module
In Bootstrap 4, all generic CSS selectors and reset styles would be moved into a single and easy to use SCSS file. The previous normalize.css reset file would get replaced now. With this smarter move, the box-sizing CSS property would make every responsive layout more convenient.