One of their improvements is dropping their Button plugin for an HTML and CSS only approach to toggle states. Checkboxes and radio buttons now power toggle buttons.
Dropping support for Internet Explorer and the removal of jQuery are few of the highlights in Bootstrap 5. Besides focusing on code quality and interface, the Bootstrap team also improved its old features and made new ones to benefit web developers.
1. Responsive Font Sizes
Bootstrap 5 will ease the challenges faced by developers in solving typography problems. They can now control the appearance of typographies on web pages with the responsive font size.
RFS is a unit resizing engine that automatically calculates the appropriate font-size values based on the user’s screen size or viewport. It can resize values for any CSS property with units, like margins, padding, border-radius, or box-shadow. It also works on preprocessors or postprocessor tools such as Sass, Less, Stylus, or PostCSS.
2. Change Gutter Width Unit of Measurement
You can specify sizes or lengths of CSS elements using various units of measurements such as em, % vw, and vh, but web developers widely use pixels or px. In Bootstrap 5, the team changed the gutter width from px to rem.
Rem or root em is equal to the calculated value of font-size on the root element. For example, 1 rem is similar to the font size of the HTML element.
In Bootstrap 5, the inline-block on the navbar has been removed and uses a flex shorthand. The Bootstrap team also removed the brand margin caused by requiring containers in navbars.
4. SVG Icon Library
In Bootstrap 5, a brand new SVG icon library was made by the co-founder of Bootstrap Mark Otto. Developers can now use these icons in their projects.
5. Enhanced Class Updates
The Bootstrap 5 has added and removed CSS classes from the 1,500 in Bootstrap 4. Here are some of the CSS classes in the new version.
- gx-* classes control the horizontal/column gutter width
- gy-* classes control the vertical/row gutter width
- g-* classes control the horizontal & vertical gutter width
The following are the CSS classes removed by the Bootstrap team.
Bootstrap in Japan
If you have tried working with the previous versions of Bootstrap, it may be easier for you to adjust working with its version 5. Here are some of the critical changes in Bootstrap 5 and the skills you have to learn before working in Japan as a web developer
From Jekyll to Hugo
IT companies in Japan are looking for web developers who can use various open-source static site generators, such as Jekyll and Hugo.
Developers have used Bootstrap 4 as a tool for integrating Jekyll through SASS. But with the recent developments in Bootstrap 5, the team has made a switch to the fast and flexible static site generator Hugo.
Hugo has already been making waves in the web development community for its easy configuration and excellent integration. Being skilled in the open-source static site generator will be beneficial as more web developers in Japan use Bootstrap and other open-source frameworks in the future.