- The
box-sizing is globally set on every element—including *::before and *::after, to border-box. This ensures that the declared width of element is never exceeded due to padding or border.
font-size: 16px is applied on the <body> for easy responsive type-scaling via media queries while respecting user preferences and ensuring a more accessible approach. font-size: 1rem is assumed to be equavalent of 16px (the browser default or the custom font size any user sets on his browser's appearance settings).- The
<body> also sets a global font-family, line-height, and text-align. This is inherited later by some form elements to prevent font inconsistencies.