box-sizing border-box, applied once, globally

The default box model adds padding and borders outside the width you set, so a column declared at 25% with 10px of padding is not 25% wide. Every grid system works around this, and every hand-written layout rediscovers it.

html {
    box-sizing: border-box;
}

*, *::before, *::after {
    box-sizing: inherit;
}

The reason for the two rules rather than one * { box-sizing: border-box } is inherit: a third-party widget that needs the content box can opt out by setting it on its own root, and everything inside follows. With the universal selector, that component would have to reset every descendant.