Additional global changes
The change to Sass is one of the bigger global differences in version 4 of Bootstrap. Let's take a look at a few others you should be aware of.
Using REM units
In Bootstrap 4, px has been replaced with rem for the primary unit of measure. If you are unfamiliar with rem it stands for root em. Rem is a relative unit of measure where pixels are fixed. Rem looks at the value for font-size on the root element in your stylesheet. It then uses your value declaration, in rems, to determine the computer pixel value. Let's use an example to make this easier to understand:
html { font-size: 24px; } p { font-size: 2rem; }
In this case, the computed font-size for the <p>
tag would be 48px. This is different from the em unit because ems will be affected by wrapping elements that may have a different size. However, rem takes a simpler approach and just calculates everything from the root HTML element. It removes the size...