One of the cool new features in this version of Sass Bootstrap is the ability to create a size that responds to the width of the device. The only way to access this feature is with the Sass version of Bootstrap and it's easily done by turning in a single Sass variable. Let's take a look at how it works and how to add it to different components.
- [Instructor] The Bootstrap CSS normally … does everything you need to put a website together. … But we can actually modify some variables … that will affect how Bootstrap builds itself … and we can add features that cannot be added any other way. … One of those is responsive font sizes. … It's a pretty new feature in Bootstrap 4.3. … What it allows you to do is change the font size … of the elements on your page depending on … the width of the screen and do that dynamically … by performing some calculations. … When I'm resizing the screen right now … you'll see that the font isn't actually changing size … it's just re flowing to accommodate the width of the screen. … I'm going to make this pretty small here … and they should still be the same size. … Then going to going to my custom CSS file … and turn on this variable. … It's called enable-responsive-font-sizes … and I'll set this to true. … So, make sure you keep your eye right here. … As soon as they save that and the files process …
Released
4/18/2019- Installing Bootstrap 4
- Installing additional fonts and libraries
- Customizing Bootstrap 4
- Configuring Sass variables
- Adjusting global settings
- Using utility mixins
- Adjusting components with CSS and Sass
Share this video
Embed this video
Video: Enabling responsive font sizes